javascript - 关闭事件后的角度 ui 模态

Question

有没有一种方法可以在调用模态窗口后调用函数（无论是通过按钮还是通过单击背景发生）

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'
  });
});

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

知道我该怎么做吗？

Answer 1

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

then(successCallback, errorCallback, notifyCallback) 

• 当 promise 被解决时， successCallback被执行。
• 当 promise 被拒绝时执行errorCallback 。
• notifyCallback在收到通知时执行。

在 angular-ui 的 modal 的情况下，点击背景会导致 promise 被拒绝。考虑到这一点，您的代码可以更改为：

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

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

Answer 2

Angular 1.2 支持带有finally(callback):

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

在这里查看工作中的 plunker 。