Lassen Sie mich Ihnen sagen, dass $ modal eine Methode hat: Open und die Eigenschaften dieser Methode werden eingeführt:
Templateurl: Die Adresse des Modalfensters
Vorlage: Wird zum Anzeigen von HTML -Tags verwendet
Umfang: Die Verwendung von Inhalten mit einem modalen Bereich (in der Tat erstellt $ modal ein Subscope des aktuellen Umfangs) standardmäßig ist $ rootscope
Controller: Der für $ modal angegebene Controller initialisiert $ scope, dem $ modalinstance injiziert werden kann
Auflösung: Definieren Sie ein Mitglied und geben Sie es an den von $ modal angegebenen Controller. Es entspricht einer Reslove -Eigenschaft von Routen. Wenn Sie ein Objekt übergeben müssen, müssen Sie angular.copy () verwenden.)
Backdrop: Steuern Sie den Hintergrund, zulässige Werte: TRUE (Standard), Falsch (kein Hintergrund), "statisch" - Der Hintergrund existiert, aber beim Klicken außerhalb des Modalsfensters wird das Modal -Fenster nicht geschlossen
Tastatur: Wenn ESC gedrückt wird, ob das modale Dialogfeld geschlossen ist, standardmäßig ture
Fensterklasse: Geben Sie eine Klasse an und fügen Sie sie dem Modalfenster hinzu
Die offene Methode gibt eine Instanz mit den folgenden Eigenschaften zurück:
Schließen (Ergebnis): Schließen Sie das Modalfenster und geben Sie ein Ergebnis weiter
Entlassung (Grund): die modale Methode rückgängig machen und einen Grund übergeben
Ergebnis: Ein Vertrag, der verabschiedet wird, wenn das Modalfenster geschlossen oder widerrufen wird
Öffnet: Ein Vertrag, eine Variable, die beim Öffnen des Modalsfensters übergeben wurde und der Inhalt geladen wird
Darüber hinaus erweitert $ modalinstance zwei Methoden $ Close (Ergebnis), $ entlass (Grund), die Windows leicht schließen und keine zusätzlichen Controller benötigen
<! DocType html> <html ng-App = "modalDemo"> <kopf> <titels> </title> <link href = "lib/bootstrap/css/bootstrap.min src = "lib/bootstrap-gh-pages/ui-bootstrap-tPLS-0.7.0.min.js"> </script> <script src = "lib/angular/i18n/Angular-locale_zh-cn.js"> </script> </head> <body> <body> <body> <body> <body> <div ng-controller = "modaldemoctrl type = "text/ng-template" id = "myModalContent.html"/> <div> <h3> Ich bin ein Modal! }} </b> </div> <div> <button ng-klick = "OK ()"> OK </button> <button ng-klick = "civilre ()"> civiling </button> </div> </script> <button ng-klick = "open ()"> öffnen Sie mich. ei function () {return $ scope.items;}}}); modalInstance.opened.then (function () {// Die nach dem Modalfenster geöffnete Funktion wird ausgeführt, und der Hintergrund wird immer ausgegeben, nachdem das Modal -Fenster geöffnet ist. Klicken Sie klicken, klicken Date ());});});};}; var modalinStancectrl = function ($ scope, $ modalinstance, items) {$ scope.Items = items; $ scope.selected = {item: $ scope.Items [0]}; function () {$ modalInstance.dismiss ('cancel');};}; </script> </body> </html>Das obige ist der AngularJS $ Modal Popup-Box-Beispielcode, der Ihnen vom Editor vorgestellt wurde. Ich hoffe, es wird Ihnen hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Editor wird Ihnen rechtzeitig antworten. Vielen Dank für Ihre Unterstützung auf der Wulin.com -Website!