Gibt es einen Unterschied zwischen {{}} und ng-bind in angular.
Ich bin ziemlich neu in Angular. Ich begann mit {{}} und dann in der Dokumentation finde ich ng-bind. Ich denke, sie machen die gleiche Arbeit, aber dann, warum eine Extra-Richtlinie, wenn nicht, dann bitte sagen Sie den Unterschied.
Es gibt einen Hinweis in den offiziellen Dokumenten: Ссылка
Normalerweise verwenden Sie ngBind nicht direkt, sondern verwenden stattdessen die doppelt gelocktes Markup wie {{Ausdruck}}, das ähnlich aber weniger ist ausführlich.
Es ist vorzuziehen, ngBind anstelle von {{expression}} zu verwenden, wenn a Die Vorlage wird momentan im Rohzustand des Browsers angezeigt vor Angular kompiliert es. Da ngBind ein Elementattribut ist, ist es macht die Bindungen für den Benutzer unsichtbar, während die Seite geladen wird.
Der offensichtlichste Unterschied zwischen ihnen ist Flash of Unstyled Inhalt bei der Verwendung von {{ ... }}
.
Es gibt jedoch einen subtileren Unterschied zwischen den beiden, wenn das Objekt, das Sie an {{ obj }}
und ng-bind="obj"
übergeben, keine Zeichenfolge ist.
Aus Zypern :
Abhängig davon, ob Sie die Syntax
{{ ... }}
oderng-bind
verwenden, wird die.toJSON
und die Funktion.toString
auf Ihrem Objekt werden aufgerufen um seine Darstellung zu bestimmen.
{{}} kann blinken, wenn die Seite geladen wird, ng-bind blendet den Ausdruck aus, bis er korrekt angezeigt wird.
In AngularJs Die ng-bind-Direktive funktioniert als Alternative zur Interpolations-Direktive {{}}. Durch Einfügen eines ng-bind-Attributs in ein HTML-Element können wir AngularJS-Daten in dieses einfügen.
Hier ist ein Beispiel:
%Vor%Der Hauptunterschied besteht darin, dass das ng-bind-Attribut beim Laden der Seite keinen HTML-Inhalt anzeigt, während die Interpolationsrichtlinie beim Laden der Seite als Flash-Inhalt ohne Stil angezeigt wird.
Zusätzlich zu den oben genannten Antworten
Leistungsprobleme mit der Interpolation:
Wie in diesem Thread besser erklärt,
ng-bind
ist eine Direktive und setzt einen Watcher auf die übergebene Variable. Das ng-bind
wird nur angewendet, wenn sich der übergebene Wert tatsächlich ändert.
Die Klammern auf der anderen Seite werden in jedem $ digest überprüft und aktualisiert, auch wenn es nicht notwendig ist.
Manchmal, wenn wir unsere Anwendung in den Browser laden, können wir feststellen, dass Inhalt für einige Millisekunden blinkt, bevor {{name}} aufgelöst und Daten geladen werden.
Das passiert, weil die Vorlage geladen wird, bevor AngularJS die Elemente einlesen und kompilieren konnte. Um dieses Problem zu beheben, können Sie die ng-cover-Direktive verwenden.
Im ersten Ansatz (zB {{}}) wertet AngularJS den Ausdruck aus und ersetzt ihn durch einen Wert, der manchmal mit den blinkenden doppelt geschweiften Klammern zurückbleibt, aber ng-bind speichert diese Zeit, indem er AngularJS informiert, den Inhalt von der Ausdruck innerhalb des Elements selbst.
Hinweis: {{}} verursacht manchmal Leistungsprobleme, wenn wir Tausende von Bindungen auf unserer Seite haben. In diesen Szenarien sollten wir mit ng-bind gehen.
Der Hauptunterschied zwischen ng-bind und {{}} besteht darin, dass ng-bind einen Watcher für die an ihn übergebene Variable erstellt, während geschweifte Klammern ({{}}) den gesamten Ausdruck im Speicher speichern, dh} dirty ausführen - Überprüfung und Aktualisierung des Ausdrucks in jedem Digest-Zyklus, auch wenn dies nicht erforderlich ist.
ng-bind wird nur angewendet, wenn sich der übergebene Wert tatsächlich ändert.
Tags und Links angularjs