jQuery 关闭事件后的角度 ui 模式

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18962536/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 22:51:31  来源:igfitidea点击:

angular ui modal after close event

javascriptjquerytwitter-bootstrapangularjsangular-ui

提问by Safari

Is there a way I can call a function after a modal window got called (no matter if it happened with a button or by clicking on the backdrop)

有没有办法在调用模态窗口后调用函数(无论是使用按钮还是单击背景)

var dialog, options;

options = {
  windowClass: "lightBox"
  templateUrl: "url to the template",
  controller: "some random controller",
  scope: $scope
});

$("body").css({
  'overflow': 'hidden'
});

dialog = $modal.open(options);

dialog.result.then(function() {
  $("body").css({
    'overflow': 'auto'
  });
});

I want that everytime the modal windows closes the function in the result.then promise get executed. Now it just executes when i close the modal manually my $modalInstance.close(). But if i click on the backdrop this method doesn't get called

我希望每次模态窗口关闭结果中的函数。然后承诺被执行。现在它只是在我手动关闭模态时执行我的 $modalInstance.close()。但是如果我点击背景,这个方法不会被调用

any idea how i can do this?

知道我该怎么做吗?

回答by Nicolas ABRIC

I will assume that you are using the Modal dialogs from angular-ui. But before going into the details a bit of documentation around promises in AngularJS is needed. You need to know that every thenfunction can accept 3 parameters as such :

我将假设您使用的是 angular-ui 中的模态对话框。但是在进入细节之前,需要一些关于 AngularJS 中 promise 的文档。您需要知道每个then函数都可以接受 3 个参数,例如:

then(successCallback, errorCallback, notifyCallback) 
  • successCallbackis executed when the promise is resolved.
  • errorCallbackis executed when the promise is rejected.
  • notifyCallbackis executed when notified.
  • 当 promise 被解决时,successCallback被执行。
  • errorCallback在承诺被拒绝时执行。
  • notifyCallback在收到通知时执行。

In the case of angular-ui's modal, clicking on the backdrop will result in a rejected promise. With this in mind, your code could be changed to :

对于 angular-ui 的模态,点击背景会导致被拒绝的承诺。考虑到这一点,您的代码可以更改为:

dialog.result.then(function () {
  alert('Modal success at:' + new Date());
}, function () {
  alert('Modal dismissed at: ' + new Date());
});

You can see a working plunker here

你可以在这里看到一个工作的plunker

回答by Derek

Angular 1.2 supports promises with a finally(callback):

Angular 1.2 支持 promise 为finally(callback)

dialog.result.finally(function() {
    alert('clean up resources');
});

Check out the working plunker here.

在这里查看工作的plunker 。