Question

我想要一个指令在三个范围变量发生变化时重新呈现HTML。前两个只是整数，第三个是数组。

我们$watchGroup要观看多个变量，我们$watch objectEquality作为第三个参数，我们$watchCollection就像$watch，但隐含objectEquality。

有没有办法写一个类似于此的$ watch？

$scope.$watchGroup(['number1', 'number2', 'myArray'], callback, true); // true for objectEquality

Answer 1

看来watchGroup不支持深度观看。所以你可以通过注册一个匿名的深度观察者来进行黑客攻击，这些观察者会通过监视函数传入一组值。

$scope.$watch(function(){
     return ['number1','number2','myArray'].map(angular.bind($scope, $scope.$eval));
  }, function(newV){
      console.log(newV);
  },true);

<强> Demo

或者只是在rootScope上将此函数添加为实用程序函数，并从任何继承的范围访问它。

.run(function($rootScope){
  $rootScope.deepWatchGroup = function(exp, callback){
    if(!angular.isArray(exp) || !thisScope.$watch) return; //Or log some error if array is not passed in or the context is not really a scope object

   var thisScope = this, //get scope
        evalFunc = angular.bind(thisScope, thisScope.$eval); //and a bound eval func

     thisScope.$watch(function(){
        return exp.map(evalFunc); //return array of evaluated values
     }, callback,true);
   }
});

并从您的控制器执行：

$scope.deepWatchGroup(['number1','number2','myArray'],function(newV){
  console.log(newV);
});

<强> Demo

Answer 2

如果你想观看字符串表达式的数组（即你不需要观察$watchGroup和PSL的解决方案都可以处理的函数），这里是替代方案：

$scope.$watch('[number1, number2, myArray]', callback, true);

如果你想为类似PSL的那个做一个实用功能：

.run(function($rootScope){
  $rootScope.deepWatchGroup = function(watchExpressions, listener){
    this.$watch('[' + watchExpressions + ']', listener, true);
  }
});

Answer 3

我也遇到了与你同样的问题。

我对这个深层观察组问题的解决方案是：

b[label='variable_x[1]=BARI_POP4_5_PRIMARY_CN.csv']

我希望这会有所帮助！

如何使用具有对象相等性的$ watchGroup或深入观察组中的属性？

3 个答案: