Skip to content

Instantly share code, notes, and snippets.

@ytoney
Created August 5, 2014 16:28
Show Gist options
  • Save ytoney/7f119e9bdb9310845bc0 to your computer and use it in GitHub Desktop.
Save ytoney/7f119e9bdb9310845bc0 to your computer and use it in GitHub Desktop.
什么时候用$apply()
情况非常少,实际上几乎我们所有的代码都包在$scope.$apply()里面,像ng-click,controller的初始化,$http的回调函数等。在这些情况下,我们不需要自己调用,实际上我们也不能自己调用,否则在$apply()方法里面再调用$apply()方法会抛出错误。如果我们需要在一个新的执行序列中运行代码时才真正需要用到它,而且当且仅当这个新的执行序列不是被angular JS的库的方法创建的,这个时候我们需要将代码用$scope.$apply()包起来。
下面用一个例子解释:
[HTML]
<div ng:app ng-controller="Ctrl">{{message}}</div>
[Javascript]
复制代码
functionCtrl($scope) {
$scope.message ="Waiting 2000ms for update";
setTimeout(function () {
  $scope.message ="Timeout called!";
// AngularJS unaware of update to $scope
}, 2000);
}
复制代码
上面的代码执行后页面上会显示:Waiting 2000ms for update。显然数据的更新没有被angular JS觉察到。
接下来,我们将Javascript的代码稍作修改,用$scope.$apply()包起来。
[Javascript]
复制代码
functionCtrl($scope) {
$scope.message ="Waiting 2000ms for update";
setTimeout(function () {
  $scope.$apply(function () {
  $scope.message ="Timeout called!";
});
}, 2000);
}
复制代码
这次与之前不同的是,页面上先会显示:Waiting 2000ms for update,等待2秒后内容会被更改为:Timeout called! 。显然数据的更新被angular JS觉察到了。
NOTE:我们不应该这样做,而是用angular JS提供的$timeout方法,这样它就会被自动用$apply方法包起来了。
http://www.2cto.com/kf/201311/256848.html
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment