### 6.1. 数据->模板 数据到表现的绑定，主要是使用模板标记直接完成的： <p>{{ w }} x {{ h }}</p> 使用 _{{ }}_ 这个标记，就可以直接引用，并绑定一个作用域内的变量。在实现上， ng 自动创建了一个 _watcher_ 。效果就是，不管因为什么，如果作用域的变量发生了改变，我们随时可以让相应的页面表现也随之改变。我们可以看一个更纯粹的例子： <p id="test" ng-controller="TestCtrl">{{ a }}</p> <script type="text/javascript"> var TestCtrl = function($scope){ $scope.a = '123'; } angular.bootstrap(document.documentElement); 上面的例子在页面载入之后，我们可以在页面上看到 `123` 。这时，我们可以打开一个终端控制器，输入： $('#test').scope().a = '12345'; $('#test').scope().$digest(); 上面的代码执行之后，就可以看到页面变化了。 对于使用 ng 进行的事件绑定，在处理函数中就不需要去关心 _$digest()_ 的调用了。因为 ng 会自己处理。源码中，对于 ng 的事件绑定，真正的处理函数不是指定名字的函数，而是经过 _$apply()_ 包装过的一个函数。这个 _$apply()_ 做的一件事，就是调用根作用域 _$rootScope_ 的 _$digest()_ ，这样整个世界就清净了： <p id="test" ng-controller="TestCtrl" ng-click="click()">{{ a }}</p> <script type="text/javascript" charset="utf-8"> var TestCtrl = function($scope){ $scope.a = '123'; $scope.click = function(){ $scope.a = '456'; } } angular.bootstrap(document.documentElement); 那个 _click_ 函数的定义，绑定时变成了类似于： function(){ $scope.$apply( function(){ $scope.click(); } ) } 这里的 _$scope.$apply()_ 中做的一件事： $rootScope.$digest();