Dieser Artikel stellt hauptsächlich die Datenbindung von AngularJS vor, die einen gewissen Referenzwert hat. Jetzt können Freunde in Not darauf verweisen.
Dort sind drei Datenbindungsmethoden in anglejs1.X für die Datensynchronisierung und -anzeige. Vor angularjs 1.3
gab es nur zwei Arten von angularjs
: two-way-binding
und one-way-bindng
, und dann wurde ein Bindungsmechanismus namens one-time-binding
eingeführt.
Derzeit gibt es in angularjs
die folgenden drei Datenbindungsmethoden:
Zwei-Wege-Bindung
eine -Wege-Bindung
Einmal-Bindung
angularjs
in besteht darin, Two-way-binding
und Model
zuzuordnen. Datenänderungen auf einer Seite aktualisieren die Daten auf der anderen Seite. View
Datenmodell zugeordnet werden.
<input type="text" id="text" ng-model="name"/>
können wir den Wert des Eingabefelds (ng-model
) einfach mit view
(name
) verknüpfen. Unabhängig davon, ob wir den Wert des Eingabefelds ändern oder Model
ändern, wird die andere Seite unter dem Einfluss des bidirektionalen Datenflusses rechtzeitig mit neuen Daten aktualisiert. name
ist eine in ng-model
integrierte Anweisung zur Implementierung einer bidirektionalen Bindung. angularjs
In verschiedenen Lebenszyklen gibt es unterschiedliche logische Prozesse. ng-model
-Befehl und ng-model
-Befehl werden zusammengeführt und in der input
-Tag-Registrierung verarbeitet input
-Ereignis (DOM-Ereignis); keydown
registriert ein interpolation
, um das $watch
-Ereignis (angularjs-Ereignis) zu abonnieren. change
keydown
-Anweisung erfasst das input
-Ereignis und ruft keydown
auf, um die Aktualisierungsaktion anzufordern. $apply
Wert aktualisieren auf angularjs
Model
eingeben $digest
-Ausdruck erkennt, dass $watch
auftritt, benachrichtigt Model
und fordert eine Aktualisierung change
an. interpolation
DOM
angularjs
unidirektional. das heißt, es fließt nur von Two-way-binding
nach one-way-binding
, nicht jedoch von model
nach view
. Daher wird view
zum Anzeigen von Daten und nicht zum Abrufen von Eingaben verwendet. model
one-way-binding
In
zwei Syntaxen: angularjs
und one-way-binding
. ng-bind
<span ng-bind="name"> </span> <span>{{name}}</span>
{{expression}}
Für ist der interne Mechanismus teilweise derselbe wie für . one-way-binding
two-way-binding
, um das interpolation
-Event (AngularJS-Event) zu abonnieren. . $watch
change
ein. angularjs
$digest
erkennt Datenänderungen, benachrichtigt expression
und fordert Aktualisierung $watch
an. interpolation
DOM
angularjs
einen Mechanismus namens 1.3
. Im Wesentlichen unterscheidet sich sein Mechanismus nicht wesentlich von den beiden anderen Methoden, verhält sich jedoch anders, wenn Daten aktualisiert werden. angularjs
one-time-binding
, um auf Datenänderungen zu warten, bricht die Überwachung jedoch ab, wenn zum ersten Mal Daten 对于上面的代码,假设 那么,假设 在我看来, 而 文中难免存在一些错误,欢迎大家斧正。 以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网! 相关推荐:one-time-binding
nicht-undefiniert$watch
erkannt werden. <span>{{::name}}</span>
name
从 undefined
-> angularjs
-> angular
,最终渲染的结果是 angularjs
,而不是 angular
。 这就是 one-time-binding
的特殊之处,当 name
从 undefined
变化为 angularjs
之后,被认定为 name
的状态已经是 stable
,因此将取消 $watch
, 即不再监听数据变化。name
从 ''
-> angularjs
-> angular
, 则渲染结果是 ''
,即空字符串(第一次的值)。因为 one-time-binding
在计算 stable
时候使用的 严格相等,即 newVal === undefined
, 如果是,则继续保留 $watch
等待下一次的比较;否则,状态变更为 stable
,取消 $watch
, 数据转化为最终态。结束
angularjs
核心在于 angularjs context
和 $digest
。angularjs context
保证 angularjs
可以捕获到各种事件,用户输入、鼠标事件、键盘事件、甚至 $settimeout
和 $http
等异步行为的状态流转。$digest
则保证 angularjs
可以确认是否要更新数据。
Das obige ist der detaillierte Inhalt vonDatenbindung für AngularJS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!