angularjs – How to perform an action whenever $uibModal is closed?

Question:

How do I perform an action whenever $uibModal is closed?

Just to make my learning easier, when I close the modal, I want to display a message.

For example:

angular.module('app', ['ui.bootstrap']).controller('TesteController', function ($scope, $uibModal) {

     $scope.modal = function () {

          var modal = $uibModal.open({
             template: '<div class="modal-body">Olá mundo</div>'
          });

          // Como posso executar isso?

          modal.quandoFechar(function () {
            $scope.mensagem = 'Você fechou o modal';
          });
     };
})

The modal.quandoFechar function obviously doesn't exist, but I want to know if there is any function that performs a callback when $uibModalInstance is closed.

Answer:

To perform some action with the "result" of the modal, you need to use the promise result and then function.

All then functions can receive up to three callbacks

• successCallback is executed when the promise is resolved;
• errorCallback is executed when the promise is rejected;
• notifyCallback is executed when notified.

Whenever a click occurs outside the modal area (in the background) it will result in a rejected promise.

Example:

modal.result.then(function () {
    $scope.mensagem = 'Você fechou o modal';
}, function () {
   $scope.mensagem = 'Clique fora da modal';
});

If you want to show the same message for both cases, or even perform some action after the exception of the callback passed to then , you can use the finally function

modal.result.then(function () {
    $scope.mensagem = 'Promisse resolvida';
}, function () {
   $scope.mensagem = 'Promisse rejeitada';
})
.finally(function(){
    $scope.mensagem2 = 'Modal fechada';
});