Created
August 5, 2014 16:28
-
-
Save ytoney/7f119e9bdb9310845bc0 to your computer and use it in GitHub Desktop.
什么时候用$apply()
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
情况非常少,实际上几乎我们所有的代码都包在$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