2016-10-20 3 views
0

Ich benutze Bootstrap Modale, aber ohne die volle Funktionalität ausnutzen zu können.uibmodalinstance result/reason/close/follow

Mein Modal ist im Grunde ein Bearbeitungs-Popup. So hat es eine Speichern und eine Abbrechen.

  • Wenn es Speicher d, erfolgreich, soll es schließen und dann die Mutter soll Route zu einer anderen Seite.
  • Wenn es ist Abbrechen ed es sollte schließen, aber nicht umleiten.

Dinge die ich nicht wirklich bekommen:

  • was/wo ich die ‚Vernunft‘ erfassen, wenn es
  • entlassen ist, wenn ich diese verwenden können, um zu entscheiden, ob
  • zum Umleiten
  • wie geschlossen/result/dismit arbeiten zusammen.

Ich habe mir eine Reihe von Antworten angesehen, und ich scheine einfach nicht zu sehen, wie sie zusammen behandelt werden.

 var modalInstance = $uibModal 
     .open({ 
      templateUrl: 'cartModalContent', 
      controller: 'cartModalInstanceController', 
      controllerAs: 'cartModalVm', 
      resolve: { 
       payData: vm.PayData 
      } 
     }) 
     .closed 
      .then(function(){ 
        $state.go('layout.package-labels'); 
      }); 
     modalInstance.result.then(function() { 
      // ?? 
     }); 

Antwort

1

Im Zweifelsfall always go to the docs. Unter dem Modal Abschnitt finden Sie diesen Text finden

Die offene Methode gibt eine modale Instanz, ein Objekt mit den folgenden Eigenschaften:

schließen (Ergebnis) (Typ: Funktion) - Kann verwendet werden, ein schließen modal, übergibt ein Ergebnis.

entlassen (Grund) (Typ: Funktion) - Kann verwendet werden, um ein Modal zu entlassen, einen Grund zu übergeben.

Ergebnis (Typ: Versprechen) - Wird aufgelöst, wenn ein Modal geschlossen und abgelehnt wird, wenn ein Modal abgewiesen wird.

geöffnet (Typ: Versprechen) - Wird aufgelöst, wenn nach dem Herunterladen der Inhaltsvorlage und dem Auflösen aller Variablen ein Modal geöffnet wird.

geschlossen (Typ: Versprechen) - Wird aufgelöst, wenn ein Modal geschlossen und die Animation beendet wird.

gerendert (Typ: Versprechen) - Wird aufgelöst, wenn ein Modal gerendert wird.

Was es bedeutet, ist

  1. , wenn Sie die $uibModal.open Methode aufrufen (und das modale Definition Objekt, um es passieren) erhalten Sie eine modale Instanz erhalten
  2. Sie mehrere Versprechungen der modal-Instanz zugreifen können . Diese Versprechen werden sich danach richten, was Sie mit dem Modal machen.
  3. So, wenn Sie dismiss Ihr Modal, das result Versprechen wird ablehnen und wenn Sie close das Modal wird es auflösen.

So Ihr Code muss etwas aussehen

var modalInstance = $uibModal.open({ 
    animation: true, 
    templateUrl: 'template.html', 
    controller: 'modalCtrl', 
    controllerAs: '$ctrl', 
    size: size, 
    appendTo: parentElem, 
    resolve: { 
    info: function() { 
     return '42'; 
    } 
    } 
}); 

modalInstance.result.then(function (resolvedResponse) { 
    $state.go('whereever') 
}, function (rejectionResponse) { 
    // do something else 
}); 

Und weil Ihr Anwendungsfall eine einfache ok/Abbrechen Dialog ist, können Sie die in close/dismiss Ausdrücke verwenden errichtet wie so

<button class="btn btn-primary" type="button" ng-click="$close('ok')">OK</button> 
<button class="btn btn-warning" type="button" ng-click="$dismiss('cancel')">Cancel</button> 

und wenn Sie das Modal schließen

modalInstance.result.then(function (resolvedResponse) { 
    // resolvedResponse = 'ok' 
}, function (rejectionResponse) { 
    // rejectionResponse = 'cancel' 
}); 
Verwandte Themen