是否有一种简洁的方法来定义AngularJS的大型手表集合？

我正在使用以下代码：

        $scope.$watchCollection('[config.examId, config.pageType, config.createdBy, config.modifiedBy, config.reference]',
            function (newValue, oldValue) {
                if (typeof newValue !== 'undefined' && typeof oldValue !== 'undefined' && newValue !== oldValue) {
                    _u.putConfigs($scope.config);
                    //$scope.grid.data = null;
                };
             });

---

现在我必须向集合中添加更多项目。有没有一种方法可以将这些信息整齐地分布在多行上？据我所知（可能是错的）。watchCollection必须是一个字符串。

传递给

watchCollection

的第一个参数可以是一个表达式（字符串）或一个函数，它应该返回被监视的对象。通过将“

”[config.examId，config.pageType，/*…*/]”传递给“
”$watchCollection
，angular将在每个摘要周期创建一个新的数组。这很有效，但可能不是你想要的

表情
作用
对象
请注意，您还可以查看对象而不是数组：

$scope.config = { /* your properties */ };

$scope.$watchCollection('config', function() { 
  /* do magic */ 
});

$scope.myProperty = 'this will fire the callback';

如果你能像null建议的那样观看整个集合，那就是最好的选择。如果出于任何原因不能，您也可以观察如下单个值：

var toWatch = [
    'config.examId',
    'config.pageType',
    'config.createdBy',
    'config.modifiedBy',
    'config.reference'
];
toWatch.forEach(function (watchExpression) {
    $scope.$watch(watchExpression,
        function (newValue, oldValue) {
            if (typeof newValue !== 'undefined' && typeof oldValue !== 'undefined' && newValue !== oldValue) {
                _u.putConfigs($scope.config);
                //$scope.grid.data = null;
            }
        });
});

好吧，看起来您在配置对象中使用了简单的字段，您可以轻松地修改它以拥有多个手表（这样可以更灵活）。即使您有复杂的对象，也可以使用deep flag查看它们：

var app = angular.module('app', []);
app.controller('ConfigCtrl', function($scope, $parse, $log) {
    $scope.config = {};

    // initial configuration
    $scope.watchProperties = ['examId', 'pageType', 'createdBy', 
                          'modifiedBy'];

    // dynamic modifications to the watched properties
    $scope.configureWatchProperties = function() {
        $scope.watchProperties.push('reference');
    }

    $scope.updateConfig = function() {
        // TODO: update config here
        $log.log('config updated:', $scope.config);
    }

    $scope.addWatchProperty = function(context, property, deep) {
        $scope.$watch(function() {
            return $parse(property)(context);
        }, function(newValue, oldValue) {
            if (newValue && newValue !== oldValue) {
                $scope.updateConfig();
            }
        }, deep);
    }

    $scope.configureWatch = function() {
        angular.forEach($scope.watchProperties, function(prop) {
            $scope.addWatchProperty($scope.config, prop);
        });
    }

    $scope.configureWatchProperties();
    $scope.configureWatch();
});

函数中使用的myArray在哪里？您是否建议在表达式标题下使用代码？我有点搞不懂你在用函数标题下的代码做什么。是的，对不起。。。打错了字。更正了。你可以用任何一种方法；表达式或函数。在这两种情况下，Angular将使用函数的结果或表达式的结果。使用表达式可以指向作用域上的值。使用函数允许使用不在作用域上的值。$scope.myArray=[config.examId，config.pageType，/*…*/]；不起作用：-（它给出一个错误，说没有像config.examId这样的对象，只需在它前面添加$scope:
$scope.myArray=[$scope.config.examId]
使用内置$watchCollection有什么好处？还有
行返回$parse（属性）（上下文）；
很可能会对性能产生影响，因为这将在每个$digest上执行多次。不，$parse没有影响，因为它在这种情况下非常简单。它是为了灵活性而添加的，因为您可以在那里使用更复杂的表达式。我认为，$watchCollection也会做类似的事情，在这种情况下，它更灵活，更容易转换吝啬的。
var toWatch = [
    'config.examId',
    'config.pageType',
    'config.createdBy',
    'config.modifiedBy',
    'config.reference'
];
toWatch.forEach(function (watchExpression) {
    $scope.$watch(watchExpression,
        function (newValue, oldValue) {
            if (typeof newValue !== 'undefined' && typeof oldValue !== 'undefined' && newValue !== oldValue) {
                _u.putConfigs($scope.config);
                //$scope.grid.data = null;
            }
        });
});

var app = angular.module('app', []);
app.controller('ConfigCtrl', function($scope, $parse, $log) {
    $scope.config = {};

    // initial configuration
    $scope.watchProperties = ['examId', 'pageType', 'createdBy', 
                          'modifiedBy'];

    // dynamic modifications to the watched properties
    $scope.configureWatchProperties = function() {
        $scope.watchProperties.push('reference');
    }

    $scope.updateConfig = function() {
        // TODO: update config here
        $log.log('config updated:', $scope.config);
    }

    $scope.addWatchProperty = function(context, property, deep) {
        $scope.$watch(function() {
            return $parse(property)(context);
        }, function(newValue, oldValue) {
            if (newValue && newValue !== oldValue) {
                $scope.updateConfig();
            }
        }, deep);
    }

    $scope.configureWatch = function() {
        angular.forEach($scope.watchProperties, function(prop) {
            $scope.addWatchProperty($scope.config, prop);
        });
    }

    $scope.configureWatchProperties();
    $scope.configureWatch();
});