angular笔记-$watch

前端之家收集整理的这篇文章主要介绍了angular笔记-$watch前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
  • 之前有做基于angular的一个todoList,在实现监听任务是否完成用到了$watch事件,学习的时候不仔细只以为歇够两个参数就okay了。没想到遇到了坑!原本设定是任务完成后会有弹出框提示任务完成,但是完成任务了没有反应?!经过一番倒腾,发现$watch的第三个参数也是很重要的。接下来我们就来看看如何填坑。

  • 首先$scope.$watch事件有三个参数First:监听的事件对象;Second:监听到对象变化后的执行函在数;Third:这里是布尔值,默认情况是false--这种情况只能监听数组的地址。

$scope.arrays=[

   {age1:10},{age2:20},{age3:30}

];

$scope.$watch($scope.arrays,function(){......},false);
//FALSE是默认的也可以不写,这里监听的是数组的地址,如果仅仅是数组的“值”发生了变化监听事件不起作用!!
  • 为了能够监听到数组值的变化,有两种方式:

    • 很简单只需要把第三个参数写成true;

    $scope.$watch($scope.arrays,true);
    • 相对会麻烦一点,不用管第三个参数,就是把监听结果返回为JSON字符串,好吧,直接演示

    $scope.$watch(function(){
    
    return JSON.stringify($scope.arrays);
    
    },function(){......});

    好啦,大功告成,爬坑成功,继续前进。

猜你在找的Angularjs相关文章