看多$ scope属性(Watch multiple $scope attributes)

2019-06-17 17:41发布

有没有办法使用订阅多个对象的事件$watch

$scope.$watch('item1, item2', function () { });

Answer 1:

从AngularJS 1.3开始有一个所谓的新方法$watchGroup观察一组表达式。

$scope.foo = 'foo';
$scope.bar = 'bar';

$scope.$watchGroup(['foo', 'bar'], function(newValues, oldValues, scope) {
  // newValues array contains the current values of the watch expressions
  // with the indexes matching those of the watchExpression array
  // i.e.
  // newValues[0] -> $scope.foo 
  // and 
  // newValues[1] -> $scope.bar 
});


Answer 2:

与AngularJS开始1.1.4可以用$watchCollection

$scope.$watchCollection('[item1, item2]', function(newValues, oldValues){
    // do stuff here
    // newValues and oldValues contain the new and respectively old value
    // of the observed collection array
});

Plunker例如这里

文档在这里



Answer 3:

$watch第一个参数也可以是一个函数。

$scope.$watch(function watchBothItems() {
  return itemsCombinedValue();
}, function whenItemsChange() {
  //stuff
});

如果你的两个组合值是简单的,第一个参数只是一个角表达正常。 例如,名字和名字:

$scope.$watch('firstName + lastName', function() {
  //stuff
});


Answer 4:

这非常类似于原来的伪代码的解决方案,实际工作:

$scope.$watch('[item1, item2] | json', function () { });

编辑:好的,我觉得这是更好的:

$scope.$watch('[item1, item2]', function () { }, true);

基本上,我们跳过JSON一步,这似乎哑巴开始,但它不是没有它的工作。 他们密钥是对对象的相等变为相对于参考平等常被省略第三参数。 然后我们创建数组对象之间的比较实际工作的权利。



Answer 5:

您可以使用$ watchGroup功能选择范围对象的领域。

        $scope.$watchGroup(
        [function () { return _this.$scope.ViewModel.Monitor1Scale; },   
         function () { return _this.$scope.ViewModel.Monitor2Scale; }],  
         function (newVal, oldVal, scope) 
         {
             if (newVal != oldVal) {
                 _this.updateMonitorScales();
             }
         });


Answer 6:

为什么不干脆把它包装在一个forEach

angular.forEach(['a', 'b', 'c'], function (key) {
  scope.$watch(key, function (v) {
    changed();
  });
});

这是大致相同的开销提供功能组合的价值, 而实际上不必担心价值构成



Answer 7:

稍微更安全的解决方案,值组合可能是使用以下内容作为$watch功能:

function() { return angular.toJson([item1, item2]) }

要么

$scope.$watch(
  function() {
    return angular.toJson([item1, item2]);
  },
  function() {
    // Stuff to do after either value changes
  });


Answer 8:

$观看第一参数可以是角表达或功能。 查看文档$范围。$观看 。 它包含了约$腕表方法是如何工作很多有用的信息:当watchExpression被调用时,如何角比较结果等。



Answer 9:

怎么样:

scope.$watch(function() { 
   return { 
      a: thing-one, 
      b: thing-two, 
      c: red-fish, 
      d: blue-fish 
   }; 
}, listener...);


Answer 10:

$scope.$watch('age + name', function () {
  //called when name or age changed
});

在这里当两个年龄和名字价值得到改变函数将被调用。



Answer 11:

角介绍$watchGroup在1.3版中使用,我们可以看多个变量,用一个单一的$watchGroup$watchGroup需要数组中,我们可以包括所有的变量看第一个参数。

$scope.$watchGroup(['var1','var2'],function(newVals,oldVals){
   console.log("new value of var1 = " newVals[0]);
   console.log("new value of var2 = " newVals[1]);
   console.log("old value of var1 = " oldVals[0]);
   console.log("old value of var2 = " oldVals[1]);
});


文章来源: Watch multiple $scope attributes