当 $scope.$watch 表达式依赖于多个变量时会发生什么？

Question

如果在我的控制器中，我有类似的东西：

$scope.service = Service;

$scope.$watch('service.properties[service.selectedProperty]', function(newVal,oldVal){});

这里发生了什么？ service.properties 和 service.selectedProperty 都可以更改。手表最终会同时观看service.properties 和service.selectedProperty吗？

我已经对此进行了测试，当任何一个变量发生变化时，手表似乎都会执行，这正是我想要的。我想知道以这种方式使用.$watch 是否会产生任何意想不到的后果，以及它实际上是如何工作的。

Answer 1

手表最终会同时观看service.properties 和service.selectedProperty吗？

其实它是在看也不，只是对整个表达式求值的结果。我解释一下：

Angular 手表使用脏检查原则：如果整个 表达式 被评估为不同于上次评估时的其他内容，则发生更改，并且运行相关的处理程序。 （当您使用$watch 的形式时，这种行为会更加明显，该形式将函数作为其第一个参数 - 返回要监视的值。）

这意味着技术上可能存在这样一种情况：service.properties[service.selectedProperty] 的评估与以前相同，但 service.properties 是关联对象，和 service.selectedProperty , 属性键同时更改了两者（或其中任何一个） - 然而，表达式被评估为相同。在这种情况下，不会触发更改事件。

例如，给定：

var myObj = {
    a: 123,
    b: 123
};
var key = 'a';

表达式的值myObj[key] 将保持不变，即使您将key 更改为'b' 而不是'a'。

只要表达式的计算结果相同，从角度来看，什么都没有改变。对于大多数意图和目的而言，这对您来说也不重要 - 如果确实如此，那么您的 watch 表达式设置不正确，您可能想要观看更通用的表达式。