angularjs - 任何实例的 Angular UI Bootstrap 模式关闭事件

Question

我正在使用 UI Bootstrap AngularUI，当任何模式关闭时我需要调用一个函数。 我知道当特定模式实例关闭时我可以调用一个函数，如下所示:

modalInstance.result.finally(function(){
    console.log('Modal closed');
});

在 jQuery 中，我会对任何实例执行类似的操作:

$(document).on('hidden.bs.modal', function () {
    console.log('Modal closed');
});

但是如何使用 AngularJS 来实现这一点呢？

Answer 1

你可以这样做:

myApp.controller('ModalCtrl', ['$scope', '$modal', function($scope, $modal) {
    $scope.open = function() {
        var modalInstance = $modal.open({
            templateUrl: 'modal.html',
            controller: 'ModalInstanceCtrl',
            resolve: {
                params: function() {
                    return {
                        key: 'value',
                        key2: 'value2'
                    };
                }
            }
        });
        modalInstance.result.then(
            function(result) {
                console.log('called $modalInstance.close()');
                alert(result);
            },
            function(result) {
                console.log('called $modalInstance.dismiss()');
                alert(result);
            }
        );
    };
}])

以及您可以从 Controller 获得的东西。

myApp.controller('ModalInstanceCtrl', ['$scope', '$modalInstance', 'params', function ($scope, $modalInstance, params) {
    console.log(params);

    $scope.ok = function () {
        $modalInstance.close('this is result for close');
    };

    $scope.cancel = function () {
        $modalInstance.dismiss('this is result for dismiss');
    };
}]);

发现了一个巧妙的 fiddle : http://jsfiddle.net/wjohtz0y/