我有一个打开第二个模态的模态,如果打开然后关闭第二个则无法关闭第一个模态

I have a modal that opens a second modal and cannot close the first modal if open then close the second

首先,我创建了一个 codepen,我认为标题说明了一切。我创建了一个服务来处理我的模式,如此处所示

.service('ModalService', function($ionicModal, $ionicLoading, $rootScope) {
    var init = function(tpl, $scope) {
      $ionicLoading.show({
        content: 'Loading',
        animation: 'fade-in',
        showBackdrop: true,
        maxWidth: 200,
        showDelay: 0
      });

      var promise;
      $scope = $scope || $rootScope.$new();
      promise = $ionicModal.fromTemplateUrl(tpl, {
        scope: $scope,
        animation: 'slide-in-up'
      }).then(function(modal) {
        $scope.modal = modal;
        return modal;
      });
      $scope.$on('$destroy', function() {
        $scope.modal.remove();
      });
      return promise;
    }
    return {
      init: init
    }
  })

它在控制器中被调用,就像这样

   ModalService.init('modal.html', $scope).then(function(modal) {
        ...do something....
        $ionicLoading.hide();
        modal.show();
      });

问题是我只能关闭一个模式,第一个或第二个,但如果我进入第二个,我无法关闭第二个。我假设当我关闭一个时它会破坏两者的模态实例?如果我不想将它分成不同的控制器,我该如何解决这个问题?

您已将 $ionicModal.fromTemplateUrl(...).then(modal) 函数返回的 modal 控制器的所有实例分配给 $scope.modal.

第二个实例 "overwrites" 第一个,所以当您关闭第二个实例然后尝试使用关闭按钮隐藏第一个实例时 (ng-click="modal.hide()") $scope.modal 仍然指向第二...

因此,在您的服务中,您必须为 $ionicModal 的每个实例单独存储模态控制器。 以下是对您的代码的可能编辑:

http://codepen.io/beaver71/pen/dGKBmv

还要检查这个 post: 或者这个: