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
我希望每次模态窗口关闭结果中的函数。然后承诺得到执行。现在,当我手动关闭模式时,它才会执行。但如果我点击背景,这个方法就不会被调用。
any idea how i can do this?
知道我怎么做吗?
2 个解决方案
#1
57
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 then function can accept 3 parameters as such :
我假设您正在使用来自angular-ui的模态对话框。但是在详细讨论之前,需要一些关于AngularJS中承诺的文档。你需要知道,每一个then函数都可以接受3个这样的参数:
then(successCallback, errorCallback, notifyCallback)
- successCallback is executed when the promise is resolved.
- 当承诺得到解决时,执行成功的回签。
- errorCallback is executed when the promise is rejected.
- 当承诺被拒绝时,errorCallback执行。
- notifyCallback is executed when notified.
- 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
你可以看到一个工作的活塞
#2
20
Angular 1.2 supports promises with a finally(callback)
:
角1.2支持最终(回调)的承诺:
dialog.result.finally(function() {
alert('clean up resources');
});
Check out the working plunker here.
检查这里的工作柱塞。
#1
57
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 then function can accept 3 parameters as such :
我假设您正在使用来自angular-ui的模态对话框。但是在详细讨论之前,需要一些关于AngularJS中承诺的文档。你需要知道,每一个then函数都可以接受3个这样的参数:
then(successCallback, errorCallback, notifyCallback)
- successCallback is executed when the promise is resolved.
- 当承诺得到解决时,执行成功的回签。
- errorCallback is executed when the promise is rejected.
- 当承诺被拒绝时,errorCallback执行。
- notifyCallback is executed when notified.
- 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
你可以看到一个工作的活塞
#2
20
Angular 1.2 supports promises with a finally(callback)
:
角1.2支持最终(回调)的承诺:
dialog.result.finally(function() {
alert('clean up resources');
});
Check out the working plunker here.
检查这里的工作柱塞。