angularJS|angularJS 里的$watch的用法

描述 $watch方法在用的时候主要是手动的监听一个对象,但对象发生变化时触发某个事件。

$scope.$watch(watchObj,watchCallback,ifDeep)

watchObj: 需要被检测的对象,可以是以下任意一种:
1.某个数据,监测这个数据的值是否发生变化;
2.一条angular表达式,监测表达式的结果是否发生变化;
3.函数(),监测函数的返回值是否发生变化;
注意:以上都是字符串格式,并且都是在$scope作用域下执行的。
watchCallback: 监听到变化时执行的函数。
watchCallback (newValue,oldValue,scope)

1.newValue: watchObj的新的值;
2.oldValue: watchObj的旧的值;
3.scope: 就是当前控制器的$scope
注意:函数或者表达式不是在$scope作用域下执行的,所以,如果是需要调用当前作用域下的某个函数,应该是scope.watchCallback
ifDeep: 布尔值,是否深度监听。
ifDeep值设置为true, 那么angular会检测被监控对象的每个属性是否发生了变化。
其它 $watch监听的几种用法 1.$watch 单一的变量
$scope.count=1; $scope.$watch('count',function(){ ... });

2.$watch 多个变量
//当count或page变化时,都会执行这个匿名函数 $scope.count=1; $scope.page=1; $scope.$watch('count + page',function(){ ... });

3.$watch对象或数组
// 当是一个对象或数组时,需要加true,否则是监听不到对象或数组变化的。 $scope.items=[ {a:1}, {a:2} {a:3}]; $scope.$watch('items',function(){...},true);

4.$watch 函数的返回结果
//监听未完成的任务个数count $scope.unDoneCount = function() { var count = 0; angular.forEach($scope.todoList, function(todo) { count += todo.done ? 0 : 1; }); return count; }; //单选影响全选部分 $scope.$watch('unDoneCount()', function(nv) { $scope.isDoneAll = nv ? false : true; });

$watch和watchGroup/watchCollection/observe 1.$observe是angular指令中link函数第三个参数 ( attrs ) 的一个方法. 只能在指令的link函数中使用它. 它是通过$evalAsync函数实现监控的。
2.$watchGroup是用来监听一组表达式。数组中任意表达式的变化都会触发监听函数。
$scope.teamScore = 0; $scope.time = 0; $scope.$watchGroup(['teamScore', 'time'], function(newVal, oldVal) { ··· });

3.$watchCollection用来监听一个对象(包括数组), 当这个对象的任意属性发生变化时,触发监听函数。和$watch一样,第一次参数可以是一个返回一个对象的函数。
$scope.names = ['igor', 'matias', 'misko', 'james']; $scope.$watchCollection('names', function (newVal, oldVal) { ··· });

4.$observe, $watch, $watchGroup, $watchCollection都返回一个移除监听的函数。当需要取消监听的时候,直接调用。
var off = scope.$watch('name', function(newValue, oldValue){ }); off();

以上出现相关的几个方法介绍 【angularJS|angularJS 里的$watch的用法】1.$parse,$eval这两个函数都可以解析表达式的值。它们的区别在于$parse是一个服务,可以注入使用。$eval$scope对象上的一个方法,我们只能在能访问$scope的场景下使用它。
2.$evalAsync$eval一样用来解析表达式的值。但它并不会立刻计算表达式的值,而是将表达式缓存起来,等到下一次$digest(脏检查 )的时候执行。以获取更好的性能。

    推荐阅读