Question

Ionic / cordova / angular / ios应用程序：

我正在使用angular-notify来显示附加了ng-click事件的叠加消息。当ionicModal打开时，它们显示正常和ng-click事件注册EXCEPT - 当它打开并显示角度通知消息时，我无法单击它。只要我点击关闭模态（我必须点击我的通知，因为它覆盖了关闭按钮，但它仍然关闭了模态），ng-click再次注册。

我不确定如何测试这个理论，但感觉就像是由ionicModal捕获或禁用了点击。我可以做些什么（z-index设置为99999）以使这些点击得到注册？

- 更新（在带检查员的Chrome测试中）

加载元素的顺序似乎并不重要。无论是模态，通知覆盖还是首先加载弹出，问题仍然存在。

我的通知叠加层会切断点击事件，直到模态和/或弹出窗口被解除为止。

当我查看DOM检查器时，我看到弹出窗口或模式实例化时会创建一些div。这一个：

<div class="click-block click-block-hide"></div>

看起来可能会导致我的问题，但它在DOM中较低，当我删除该元素时（在Chrome Inspector中）它不能解决我的问题。

无论我设置的z-index或我在DOM中移动元素的位置（通过检查器）或我删除的背景div元素，我仍然无法点击我的通知，直到任何和所有弹出/模态被解除。

有什么想法吗？

Answer 1

你能解释一下布局好一点吗？ ionicModal是否位于消息之上？或者他们是并排的？

如果模态位于消息上方，那么它就是z-index的问题。您需要确保正在使用的类的z-index不会覆盖z-index为99999。

Answer 2

我想通了，至少如何破解它。 $ ionicModal和$ ionicPopup将一个类添加到body元素<body class='popup-open modal-open'>。我没有调查如何，但它阻止点击我的通知。

所以我在angular-notify通知中添加了一个间隔来从$ ionicBody中删除modal-open和popup-open类。

var notificationInterval;
notificationInterval = $interval(function() {
  $ionicBody.removeClass('modal-open');
  $ionicBody.removeClass('popup-open');
  //  console.log("removing those body classes while the notification is up.");
}, 1000)

对于通知解雇，我添加到$ scope。$ close function

$interval.cancel(notificationInterval)

ionicModal禁用点击事件

2 个答案: