AngularJS hat mehrere wichtige Merkmale, wie zum Beispiel:
1 MVC
2 Modular
3 Befehlssystem
4 Zwei-Wege-Datenbindung
Schauen wir uns also die Modularisierung von AngularJs an.
Lassen Sie uns zunächst darüber sprechen, warum Sie Modularität implementieren müssen:
1 Wiederverwendbarkeit von Modulen hinzugefügt
2. Definieren Sie Module, um die Anpassung der Belastungsreihenfolge zu realisieren
3 In Unit -Tests muss nicht alles geladen werden
In den vorherigen Beispielen wird der Code des Controllers direkt im Skript -Tag geschrieben, so dass die deklarierten Funktionen global sind, was offensichtlich nicht die beste Wahl ist.
Mal sehen, wie man modularisiert:
<script type = "text/javaScript"> var myappmodule = angular.module ('myapp', []); myAppmodule.filter ('test', function () {return function (name) {return 'Hallo,'+name+'!';};}); myAppmodule.controller ('myAppctrl', ['$ scope', function ($ scope) {$ scope.name = 'xingoo';}]); </script>Erstellen Sie zunächst das Modul MyAppmodule über den globalen Variablenwinkel
Angular.module ('MyApp', []);
Der erste Parameter ist der Name der gebundenen Anwendungs -App, die den Einstiegspunkt des Winkels auf der Seite identifiziert, ähnlich der Funktion der Hauptfunktion.
Der zweite Parameter [] identifiziert das abhängige Modul.
Schauen wir uns an, wie das Modul verwendet wird!
<! docType html> <html ng-app = "myapp"> <kopf> <meta http-äquiv = "content-type" content = "text /html; charSet = utf-8" /> <script src = "http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"> </script> </head> <body> <div ng-controller = "myappctrl"> {{name | Test}} </div> <script type = "text/javaScript"> var myappmodule = angular.module ('myapp', []); myAppmodule.filter ('test', function () {return function (name) {return 'Hallo,'+name+'!';};}); myAppmodule.controller ('myAppctrl', ['$ scope', function ($ scope) {$ scope.name = 'xingoo';}]); </script> </body> </html>Binden Sie einfach MyApp an NG-App und es ist in Ordnung.
Im Skript erstellen wir einen Filter und einen Controller über Module.
Der Ziel des Filters besteht darin, eine String -Modifikation hinzuzufügen.
Die Funktion des Controllers besteht darin, die Variable zu initialisieren.
Die laufenden Ergebnisse des Programms sind wie folgt:
Das obige ist die modulare Informationssortierung von AngularJs. Wir werden in Zukunft weiterhin relevante Informationen hinzufügen. Vielen Dank für Ihre Unterstützung für diese Website!