如何在$ modal中检测关闭模态窗口?角UI

时间:2014-08-17 12:14:32

标签: javascript jquery angularjs angular-ui

我在angular-ui中使用$modal创建一个模态窗口,她是创建模型的代码。

this.show = function (customModalDefaults, customModalOptions, extraScopeVar) {
    //Create temp objects to work with since we're in a singleton service
    var tempModalDefaults = {};
    var tempModalOptions = {};

    //Map angular-ui modal custom defaults to modal defaults defined in service
    angular.extend(tempModalDefaults, modalDefaults, customModalDefaults);

    //Map modal.html $scope custom properties to defaults defined in service
    angular.extend(tempModalOptions, modalOptions, customModalOptions);

    if (!tempModalDefaults.controller) {
        tempModalDefaults.controller = function ($scope, $modalInstance) {
            $scope.modalOptions = tempModalOptions;
            $scope.extraScopeVar = extraScopeVar;
            $scope.modalOptions.ok = function (result) {
                $modalInstance.close(result);
            };
            $scope.modalOptions.close = function (result) {
                $modalInstance.dismiss('cancel');
            };
        }
    }

    return $modal.open(tempModalDefaults).result;
};
到目前为止,每件事情都很好。当我在模态窗口上点击取消或OK时,模型有关闭和关闭。问题是,当我按下模态窗口外的一个单击它会消失我想要的但我也知道在该情况下运行哪个方法来覆盖它的自定义行为,我正在使用OK和关闭

1 个答案:

答案 0 :(得分:2)

$modal.open(tempModalDefaults).result

是一个承诺。当背景选项设置为' true'时,承诺将被拒绝。您可以使用then方法或catch方法(即快捷方式)将拒绝处理程序附加到该承诺:

  

catch(errorCallback) - promise.then(null,errorCallback)的简写

return $modal.open(tempModalDefaults).result.catch(function (reason) {
    // your code to handle rejection of the promise.
    if (reason === 'backdrop') {
        // do something
    }
});