$watch方法,它可以帮助我们在每个scope中监视其中的变量。
$watch 单一的变量
对于普通的变量时,如数字,字符串等,直接如下写是可以监视到变量的变化,并执行相应的函数的。
$scope.count=1;
$scope.$watch('count',function(){
...
});
$watch 多个变量
对于多个变量的监视变化,执行同一函数的话,可以将这几个变量转为字符串,以‘+’号隔开来进行监视
//当count或page变化时,都会执行这个匿名函数
$scope.count=1;
$scope.page=1;
$scope.$watch('count + page',function(){
...
});
$watch对象或数组
需要用到$watch的第三个参数,默认省略时为false,若监听对象为数组或对象,需要监听其内每个属性或元素的变化则需要设为true。
$scope.items=[{a:1},{a:2},{a:3}];
$scope.$watch(function(){},function(){
...
},true);
或者将监听对象转换成JSON字符串形式:
$scope.items=[{a:1},{a:2},{a:3}];
$scope.$watch(function(){
return JSON.stringify($scope.items);
},function(){
...
},true);
$watch 函数返回
监视一个函数返回的结果是否变化。
1、监听命名函数:参数为“函数名()”的字符串,记得加“()”!
//一个命名函数
$scope.unDoneCount = function() {
var count = 0;
...
return count;
};
//监听函数返回
$scope.$watch('unDoneCount()', function(nv) {
...
});
2、监视匿名函数:第一个参数直接写匿名函数
$scope.$watch(function(){
return $scope.unDoneCount();//不要忘了(),要执行的啊~
}, function(nv) {
...
});
取消$watch
watch的性能消耗很大,所以对于已经不需要的watch需要取消掉,每个watch的返回结果就是这个deregisterWatch()函数
//在chrome的控制台上,断点得到的$watch的返回值
function deregisterWatch() {
arrayRemove(array, watcher);
lastDirtyWatch = null;
}
所以取消watch,需要在新建时将返回值保存,取消时调用返回值的函数就可以了。
var count=1;
var unbingWatch = $scope.$watch('todoList',function(){
count++;
if(count>4){
unbingWatch(); //取消$watch
}
});
转自:http://blog.csdn.net/u010451286/article/details/50635839