在 angular ui bootstrap 模式之外单击时如何捕获背景单击事件? [英] How to catch backdrop click event when clicked out of angular ui bootstrap modal?

问题描述

在我的应用程序中，它使用 $modal.open() 函数打开一个使用另一个页面作为模板的模式弹出窗口.单击按钮时，它显示模态弹出窗口很好.如果我点击取消按钮，它就会调用这个函数并且工作正常.

In my application, it is using $modal.open() function to open a modal popup which is using another page as a template. While clicking the button, it is showing the modal popup fine. If I click the Cancel button then it is calling this function and working fine also.

    $scope.cancel=function(){
    });

但是如果用户在模态弹出窗口之外点击，我们无法通过这段代码捕获该事件

But if the user clicks outside the modal popup, we are unable to catch that event by this code

    $scope.dismiss=function(){
    });

我如何捕捉该事件?

我看过很多 AngularJS 的文章，但找不到解决方案.

I have seen many articles of AngularJS, but couldn't find a solution for this.

推荐答案

$modal.open() 返回一个带有承诺的对象.您可以使用 promise 并将其链接起来，并在 catch 中处理它.当您点击外面的背景时，它会在内部执行 dismiss 并拒绝承诺.

$modal.open() returns a object with a promise. You can use the promise and chain it though, and handle it in the catch. When you click on the backdrop outside, it does a dismiss internally and it rejects the promise.

例如:-

var instance = $modal.open(...);

 instance.result.then(function(){
  //Get triggers when modal is closed
 }, function(){
  //gets triggers when modal is dismissed.
 });

如果您在注入 $modalInstance 的孩子中使用它，您也可以在那里这样做.所以基本上而不是处理 event 这可以帮助你在 Promise 的帮助下在更高级别上做到这一点.

If you are using this in the child where $modalInstance is injected you could do that there as well. So basically rather than dealing with event this helps you do it at a higher level with the help of promises.

这篇关于在 angular ui bootstrap 模式之外单击时如何捕获背景单击事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！