CODEWITHSUNDEEP
javascriptjqueryangularjsangular-ui
MohamedAbbas
MohamedAbbas

Reputation: 1161

How to detect closing a modal window in $modal? angular-ui

I am using the $modal in angular-ui to create a modal window her is the code for creating the model.

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

till now every thing is working fine. the model have close and dismiss which run when i hit cancel or OK on the modal window. the problem is when i press a click outside modal window it gets disappear that what i want but i also what to know which method runs on that case to override it for custom behavior like which i am doing with OK and Close

Upvotes: 0

Views: 1108

Answers (1)

apairet
apairet

Reputation: 3172

$modal.open(tempModalDefaults).result

is a promise. When the backdrop option is set to 'true', the promise will be rejected. You can can attach a rejection handler to that promise by using either the then method or the catch method which is shortcut:

catch(errorCallback) – shorthand for 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
    }
});

Upvotes: 2

Related Questions