Page 347 - AngularJS权威教程
P. 347
23.2 脏值检查 327
件时调用这个回调函数。回想一下第一个例子: 19
<!DOCTYPE html>
<html ng-app>
<head> 20
<title>Simple app</title>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"> 21
</script>
</head>
<body>
<input ng-model="name" type="text" placeholder="Your name"> 22
<h1>Hello {{ name }}</h1>
</body>
</html> 23
无论何时,只要用户更新这个输入字段,UI中的{{ name }}就会改变。发生这一变化是因
为我们把UI中的输入字段绑定给了$scope.name属性。为了更新这个视图,Angular需要追踪变化。 24
它是通过给$watch列表添加一个监控函数做到这一点的。
$scope对象上的属性只会在其被用于视图时绑定。在上述例子中,我们只给$watch列表添加 25
了一个函数。
记住,对于所有绑定给同一$scope对象的UI元素,只会添加一个$watch到$watch列表中。 26
这些$watch列表会在$digest循环中通过一个叫做“脏值检查”的程序解析。
27
23.2 脏值检查
28
脏值检查是一个简单的过程,可归结为一个非常基础的概念:检查值是否发生了变化,而整
个应用还没同步该变化。
29
除Angular之外,脏值检查策略通常用于许多不同的应用程序中。游戏引擎、数
据库引擎以及对象关系映射程序(ORMs)都是这类系统很好的例子。 30
Angular应用持续跟踪当前监控的值(就是监控对象中那些稀奇古怪的东西)。Angular会遍历 31
$watch列表,如果从旧值更新后的值没有发生变化,它会继续遍历监控列表。如果值发生了变化,
该应用会启用新值并继续遍历$watch列表,如图23-1所示。
32
Anguar遍历完整个$watch列表,只要有任何值发生变化,应用将会退回到$watch循环中,
直到检测到不再有任何变化。
33
为什么要再次运行这一循环?因为如果你更新了$watch列表中某个用于更新另一个值的值,
Angular将检测不到更新,除非再次运行这个循环。
34
如果这个循环运行10次或者更多次,Angular应用会抛出一个异常,同时停止运行。如果
Angular没有抛出这个异常,应用就可能进入无限循环,这是糟糕的结果。
35
在未来版本的Angular中,这个框架会使用原生浏览器规范Object.observe(),
这将大大加速脏值检查过程。 36