angularjs - Ionic Popup 在 ionic 模态中阻止 ng-click

Question

Plunkr:Click here

我有一个 plunker 如下。我有两种方式显示ionic modal:
1) 点击按钮直接显示 ionic 模态。
2) 单击按钮显示 ionic 弹出窗口，然后单击另一个按钮显示 ionic 模式。

请注意，在情况 (1) 中，我可以通过单击左上角按钮关闭 ionic 模式，但在情况 (2) 中则不能。

注:
1) 当在 (2) 中打开 ionic 模态时， ionic 弹出窗口应该保留
2) backDropClickToClose 必须设置为 false。

为了在 ionic 弹出窗口上方制作 ionic 模式，我使用了以下 css:

.modal-backdrop {
  z-index: 13 !important;
}

我怀疑某些 CSS 阻止了 (2) 中打开的模式被点击。也许是某种 z-index。希望有人能在这方面提供帮助。

Answer 1

在 index.html 文件中包含 jquery 插件

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

在 controller.js 中添加一行以删除 popup-open 类。

$scope.showPopup = function() {
  var myPopup = $ionicPopup.show({
    template: '',
    title: 'Popup',
    scope: $scope,
    buttons: [
      { text: 'Cancel' },
      {
        text: '<b>Show Modal Dialog</b>',
        type: 'button-positive',
        onTap: function(e) {
          $('body').removeClass('popup-open');
          $scope.openModal();
          e.preventDefault();
        }
      }
    ]
  });
};

用以下代码替换 controller.js 中的 closeModal 函数。

$scope.closeModal = function() {
    $('body').removeClass('modal-open');
    $scope.modal.hide();
  };