web-dev-qa-db-fra.com

capture Angular Bootstrap UI $ uibModal événement fermé après la fermeture du modal)

J'ouvre une fenêtre modale en utilisant $ uibModal.open à partir d'un autre contrôleur, et j'ai besoin d'être averti lorsque la fenêtre modale a été complètement fermée (et non pendant la fermeture ...) afin que je puisse exécuter une fonction.

Le code qui ouvre le modal est le suivant:

var modalInstance = $uibModal.open({
  templateUrl: "myModalContent.html",
  controller: "termModalCtrl",
  windowClass: 'app-modal-window',
  resolve: {
    'params': function () { return id }
  }
});

J'ai vu quelques suggestions de solutions à utiliser:

modalInstance.result.then(function(result) {
});

Le problème est que la fonction de rappel est appelée avant la fermeture réelle de la fenêtre modale (lorsque la fenêtre modale est toujours ouverte) et ce n'est pas le comportement que je veux car cela signifie qu'il intercepte l'événement "fermeture" et non le " fermé "événement du modal.

Existe-t-il un moyen propre et simple de mettre en œuvre cela? Je serais surpris sinon, car ce comportement est très courant dans tous les cadres d'interface utilisateur de la planète ...

Veuillez aider!

javascriptangularjsmodal-dialogangular-ui-bootstrapangular-ui-modal
12
Avner Hoffmann

Essaye ça.

.open la méthode renvoie une promesse qui pourrait être chaînée avec .closed qui est l'une des nombreuses propriétés de .open méthode.

Je l'ai testé et il ne montre l'alerte qu'après la fermeture du modal et non pendant sa "fermeture".

Reportez-vous à la section "fermé" sous Retour ici

var modalInstance = $uibModal.open({
    templateUrl: "myModalContent.html",
    controller: "termModalCtrl",
    windowClass: 'app-modal-window',
    resolve: {
        'params': function () { return id }
    }
}).closed.then(function(){
  window.alert('Modal closed');
});

voici le plongeur http://plnkr.co/edit/yB3k8e3R3ZLQFQ6sfLYW?p=preview

26
Srijith

Utilisation modalInstance.result promet un deuxième rappel pour rattraper l'événement de clôture. Je reçois également une exception 'Impossible d'obtenir la propriété' puis 'de référence non définie ou nulle' on .closed.then,

 var modalInstance = $uibModal.open({
    templateUrl: "myModalContent.html",
    controller: "termModalCtrl",
    windowClass: 'app-modal-window',
    resolve: {
        'params': function () { return id }
    }
});

modalInstance.result
   .then(function (selectedItem) {
    //
   }, function () {
    //close callback
    console.info('modal closed');
   });
2
Ruben.sar