加入收藏 | 设为首页 | 会员中心 | 我要投稿李大同（https://www.lidatong.com.cn/）- 科技、建站、经验、云计算、5G、大数据,站长网!

angularjs的$watch、$watchGroup、$watchCollection的区别

发布时间：2020-12-17 08:19:27 所属栏目：安全来源：网络整理

导读：如果想在controller里面随时监听一个值的变化那就用$watch p labelstrong$watch:/strong/label input type= "text" ng-model= "name" / /p $scope.$watch( , function (newVal,oldVal){ console.log( "new:" +newVal, "old:" +oldVal) }); 以上代码实现监听n

如果想在controller里面随时监听一个值的变化那就用$watch

 
       <p> 
      
       <label><strong>$watch:</strong></label> 
      
       <input type="text"ng-model="name"/> 
      
</p>

$scope.$watch(,function(newVal,oldVal){

console.log("new:"+newVal,"old:"+oldVal)

});

以上代码实现监听name属性值的变化,但是有个缺点假如要监听很多个属性值,就要写很多个$watch
为了解决上面的问题,可以使用$watchGroup,这个监听器是把多个属性使用数组的形式作为第一个参数传入

<label>$watchGroup:</label>

"one"

"two"$scope.$watchGroup([],oldVal) {

+oldVal);

//注意：newVal与oldVal都返回的是一个数组

$watchCollection是为一堆数据进行监听

>$watchCollection:

<ul>

<li ng-repeat="d in lang">{{d}}</li>

</ul>

$scope.lang = ['C/C++''Java''C#''Python'];

$scope.$watchCollection('lang'

 
     
      
       
       +oldVal)

现在可以做个测试,使用$timeout二秒后发生变化 
  
  
   
    
     
     $timeout((){ 
     
    
   
  
  
   
    
     
     'JavaScript''Html5''Css3''Angularjs'];

},2000);

转自： https://blog.csdn.net/helloxiaoliang/article/details/52173132

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!