Почему не вызывается Цикл углового дайджеста?

0

У меня есть два контроллера и завод. Я ввожу завод и контроллер в главный контроллер, вот фрагменты кода ниже:

Фабрика:

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

  return {
    correct: 0,
    incorrect: 0
  };

});

TallyController, который принимает TallyFactory:

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, прислушиваясь к изменениям "баллов".

Когда я запускаю функцию addTally из моего MainController с помощью ng-click, он меняет значение моего Factory Object (TallyFactory). Поскольку произошли изменения, и я специально создал наблюдателя на моем TallyController ($ scope.scores), не следует запускать цикл дайджеста и обновлять консоль с новым значением моего TallyFactory?

Кроме того, мой TallyController НЕ вложен в мой MainController, они отделены друг от друга (не 100% уверены, если это имеет значение).

Я не уверен, почему цикл Digest не запускается, поскольку TallyFactory изменил значения.

  • 0
    должен работать даже без $ watch. Создайте демо, которое повторяет проблему
  • 0
    Вы смотрите не то, что нужно. $scope.$watch('scores.correct', ...
Показать ещё 3 комментария
Теги:
angular-digest

2 ответа

2
Лучший ответ
$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:

Изображение 174551

В то время как временная шкала прокрутчика в режиме глубокой $ будет выглядеть так:

Изображение 174551

  • 1
    Score просто указывает на объект, поэтому с помощью проверки глубокого равенства можно решить проблему. Проблема в том, что сам объект фабрики не меняет только свойства внутри него, но, как вы сказали, если бы это был массив, то watchCollection имеет смысл, и добавление третьего параметра для проверки глубокого равенства true устраняет проблему.
  • 2
    @shaunhusain $ watchCollection - это сценарий использования массивов и мелких объектов (а scores - мелкий объект).
Показать ещё 3 комментария
1

У меня были некоторые сомнения относительно точной правильности ответа, но после копирования кода в фрагмент, который может быть запущен, я просто подтвердил здесь, что ответ ня является приемлемым.

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++;
  }
});
<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>

Ещё вопросы

Сообщество Overcoder
Наверх
Меню