为什么没有调用Angular Digest循环？

Question

我有两个控制器和一个工厂。我正在将工厂和控制器注入主控制器，下面是代码片段：

厂：

app.factory('TallyFactory', function(){

  return {
    correct: 0,
    incorrect: 0
  };

});

接受TallyFactory的TallyController：

app.controller('TallyController', function($scope, TallyFactory){    

  $scope.$watch('scores', function(newValue, oldValue){
    console.info('changed!');
    console.log('Old: ' + JSON.stringify(oldValue));
    console.log('New: ' + JSON.stringify(newValue));
  });

  $scope.scores = TallyFactory;
});

MainController接受TallyFactory并更改TallyFactory对象的值：

app.controller('MainController', function ($scope,TallyFactory) {

    $scope.addTally = function(){
    TallyFactory.correct++;
  }
});

注意在我的TallyController（第二个片段）中，我在$ scope中添加了一个观察者，并在“得分”发生变化时进行监听。

当我通过ng-click从我的MainController运行“addTally”函数时，它会更改我的工厂对象（TallyFactory）的值。由于有变化，我在TallyController（$ scope.scores）上专门创建了一个观察者，不应该触发摘要周期，我的控制台会更新我的TallyFactory的新值吗？

另外，我的TallyController没有嵌套在我的MainController中，它们彼此分开（如果重要的话，不是100％确定）。

我不确定为什么自TallyFactory更改值以来未触发摘要循环。

Answer 1

$scope.$watch('scores.correct', function(newValue, oldValue){ ... });

关注特定财产。和

$scope.$watchCollection('scores', function(newValue, oldValue){ ... });

观看所有这些。

考虑使用深$watch

$scope.$watch('scores', function(newValue, oldValue){ ... }, true);

而不是scores属性可能包含对象。

与深$watch相比，$watchCollection即使对于简单的浅物体也能提供显着的性能提升。以下是$watchCollection的探查者时间表：

虽然deep $watch分析器时间轴如下所示：

Answer 2

我对答案的确切正确性有些怀疑，但在将代码复制到可以运行的代码段后，我刚刚在此验证了问题。答案是可以接受的。

＆＃13;

＆＃13;

angular.module('app', [])

.controller('TallyController', function($scope, TallyFactory){    
  $scope.scores = TallyFactory;
  
  $scope.$watch('scores', function(newValue, oldValue){
    alert('changed!');
    console.log('Old: ' + JSON.stringify(oldValue));
    console.log('New: ' + JSON.stringify(newValue));
  }, true);
})


.factory('TallyFactory', function(){

  return {
    correct: 0,
    incorrect: 0
  };

})

.controller('MainController', function ($scope,TallyFactory) {

    $scope.addTally = function(){
    TallyFactory.correct++;
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>


<div ng-app='app'>

  
  <div ng-controller="TallyController">
    {{scores}}
  </div>
  <div ng-controller="MainController">
    <button ng-click="addTally()">Add Tally</button>
  </div>
  
  
  
</div>

＆＃13;

＆＃13;

＆＃13;