我很有意思,angular.js内部如何检测模型被更改,以及用于处理此更改的一般角度工作流程是什么。我的意思是,在我更改模块的某些部分之后,页面上真正发生的事情。
答案 0 :(得分:0)
这是我的理解。如果我错了,请纠正我。这是双向信息共享:)
如果您知道数据绑定实际上是如何工作的,那么数据绑定并不神奇。
为了使任何变量具有数据绑定功能,必须使用$ watch方法进行注册。
$scope.$watch('aVarModel', function(newValue, oldValue) {
//update the DOM with newValue
});
每当$ scope。$ digest被调用时,将检查通过$ watch的所有这些绑定数据。请注意,Angular不会检查范围中的所有值,而只检查使用$ watch方法注册的值。如果未使用观察者注册模型,则不会进行检查。它会比较旧值和新值,以检查其中是否有任何更改。如果它改变,它将触发监听器功能(观察者方法的第二个参数)。
你可能会问你没有使用$ watch或调用$ digest注册范围内的任何变量来检查更改,但仍然会发生数据绑定。为什么呢?
AngularJS有许多内置指令实际上调用它后面的$ digest方法并观察变量以使我们的工作更容易。例如:
<div ng-app ng-init="qty=1;cost=2">
<b>Invoice:</b>
<div>
Quantity: <input type="number" min="0" ng-model="qty">
</div>
<div>
Costs: <input type="number" min="0" ng-model="cost">
</div>
<div>
<b>Total:</b> {{qty * cost | currency}}
</div>
</div>
内置的ng-model指令实际上为数量和成本变量注册观察者并调用$ scope。$ digest每当值发生变化时我们都不知道。您可以创建自定义指令
忘记提及,{{}}内的每个表达式也会在编译阶段自动被监视。因此它会随着应用程序中的任何位置的变化而发生变化。