观看多个$ scope属性

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

例如

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

从AngularJS 1.3开始,有一个名为$watchGroup的新方法用于观察一组expression式。

 $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 // ie // newValues[0] -> $scope.foo // and // newValues[1] -> $scope.bar }); 

从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示例在这里

文档在这里

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

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

如果你的两个组合值很简单,第一个参数通常只是一个angular度expression式。 例如,名字和姓氏:

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

这是一个非常类似于您的原始伪代码的解决scheme:

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

编辑:好吧,我认为这是更好的:

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

基本上我们跳过了json的步骤,这个步骤似乎很愚蠢,但是没有它,它就无法工作。 他们的关键是经常省略的第三个参数打开对象相等,而不是引用相等。 然后我们创build的数组对象之间的比较实际上是正确的。

为什么不简单地把它包装在forEach

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

这与为组合值提供函数的开销大体相同, 而实际上不必担心值组合

您可以使用$ watchGroup中的函数来select范围内的对象的字段。

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

组合值的更安全的解决scheme可能是使用下面的$watch函数:

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

要么

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

$ watch第一个参数可以是angular度expression式或函数。 请参阅$ scope的文档。 它包含了很多关于$ watch方法如何工作的有用信息:当watchExpression被调用时,angular度如何比较结果等等。

怎么样:

 scope.$watch(function() { return { a: thing-one, b: thing-two, c: red-fish, d: blue-fish }; }, listener...); 
 $scope.$watch('age + name', function () { //called when name or age changed }); 

这个函数在年龄和名字值都被改变的时候会被调用。