Angular 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/

Angular Bootstrap 任何实例的模态关闭事件

AngularUI Bootstrap modal close event for any instace

angularjs

angular-ui-bootstrap