zurückgegeben wird Vorab geschrieben: Da der Direktiventeil in AngularJS oberste Priorität hat, wird er in mehreren Kapiteln erläutert. In diesem Kapitel werden hauptsächlich die einfacheren Attribute im Objekt erläutert, das von der Direktive
Directive() wird in AngularJS verwendet, um Anweisungen zu definieren: Name (der Name der Anweisung), Factory_Function (diese Funktion definiert alle Verhaltensweisen der Anweisung und gibt ein Objekt zurück)
Kastanie:
//index.js angular.module('myApp',[]); myApp.directive('myDirective',function() {return {};});
Das zurückgegebene Objekt enthält die folgenden Eigenschaften und Methoden:
1: einschränken: Zeichenfolge
Dieses Attribut wird verwendet, um die Form zu beschreiben, in der die myDirective-Direktive im DOM deklariert wird (d. h. dort, wo sie in HTML verwendet werden soll)
Die optionalen Werte dieses Attributs sind: E (Element), A (Attribut, Standardwert), C (Klassenname), M (Kommentar), die einzeln oder in Kombination
verwendet werden können
Ich habe ein Sprichwort gesehen: Wenn Sie eine unabhängige Befehlsfunktion anpassen möchten, das heißt, der Befehl kann eine Reihe von Vorgängen unabhängig voneinander ausführen, ohne auf andere Elemente, Attribute usw. angewiesen zu sein, definieren Sie den Befehl bei Bedarf als Element So verwenden Sie diesen Befehl: Um die Funktionalität einer vorhandenen Direktive zu erweitern, definieren Sie sie als Attribut. Ich weiß nicht, ob dieses Verständnis vernünftig ist, aber es handelt sich tatsächlich um einen guten Auswahlmethodenstandard, der als Referenz verwendet werden kann
2: Priorität: Nummer
Dieses Attribut wird verwendet, um die Priorität der Anweisung zu definieren (der Standardwert ist 0, ngRepeat hat die höchste Priorität unter allen integrierten Anweisungen, nämlich 1000. Diejenige mit der höheren Priorität wird zuerst ausgeführt).
3: Terminal: Boolean
Dieses Attribut hängt mit dem Prioritätsattribut zusammen. Es wird verwendet, um zu bestimmen, ob die Ausführung von Anweisungen mit einer niedrigeren Priorität als dieser Anweisung für das aktuelle Element gestoppt werden soll, aber dennoch dieselbe Priorität ausgeführt wird
Kastanie:
//index.js angular.module('myApp',[]) .directive('myDirective',function() { return { restrict: 'AE', priority: 1, template: '<div>hello world</div>' }; }) .directive('myDirective1',function() { return { restrict: 'AE', priority: 3, terminal: true }; })
<!-- index.html --> <div my-directive my-directive1></div>
Wenn die myDirective1-Direktive nicht definiert ist, zeigt der Browser „Hallo Welt“ an, aber nachdem die myDirective1-Direktive hinzugefügt, ihre Priorität auf einen höheren Wert als myDirective gesetzt und das Terminalattribut für myDirective1 auf „true“ gesetzt wurde, wird die Ausführung gestoppt myDirective-Direktive.
4: Vorlage: String/Funktion
Dieses Attribut definiert eine Vorlage (d. h. der Teil, der diese Anweisung in der HTML-Datei verwendet, ersetzt den Inhalt der Vorlage, sodass die Vorlage hauptsächlich im HTML-Format vorliegt)
Attribute gibt es in zwei Formen: als HTML-Text und als Funktion, die eine Vorlagenzeichenfolge zurückgibt. Die Funktion empfängt zwei Parameter: tElement, tAttrs
5: templateUrl: String/Funktion
Wenn es viele Vorlageninhalte gibt, erscheint die direkte Verschachtelung in der Vorlage überflüssig. Sie können den Vorlagencode in einer separaten Datei speichern. In diesem Fall müssen Sie die Datei TemplateUrl importieren 🎜>
Attribute gibt es auch in zwei Formen: eine Zeichenfolge, die den Pfad einer externen HTML-Datei darstellt, und eine Funktion, die eine Zeichenfolge des Pfads zu einer externen HTML-Datei zurückgibt. Diese Funktion empfängt zwei Parameter: tElement, tAttrs
6: ersetzen: Boolean
Kastanie:
//index.js angular.module('myApp',[]) .directive('myDirective',function() { return { restrict: 'A', template: '<div>hello world</div>', replace: true/false }; })
<!-- index.html --> <my-directive></my-directive>
Wenn es wahr ist, wird es als
7: transclude: Boolean
Kastanie:
<!-- index.html --> <div my-directive>world</div>
//index.js angular.module('myApp',[]) .dirctive('myDirective',function() { return { restrict: 'EA', transclude: true, template: '<div>hello <span ng-transclude></span></div>' }; })
Kurz gesagt besteht der Zweck dieses Attributs darin, den AngularJS-Compiler anzuweisen, den Inhalt, den er vom DOM-Element erhält, dort abzulegen, wo er die ng-transclude-Direktive findet.
Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein.