Обновление модели программно в angularjs

Question

Я пытаюсь сделать следующее:

angular.module("controllers", []) 
    .controller("FooController", function($scope) { 
     $scope.foo = {}; 
     $scope.foo['bar'] = 0; 
     setInterval(function(){ 
      $scope.foo['bar']++; 
     }, 100); 
}); 

И потом, я показываю значение foo.bar на мой взгляд, используя

<div> {{ foo.bar }} </div> 

Начальное значение отображается правильно, но он никогда не обновляется. Обратный вызов внутри setInterval вызывается правильно, а значение bar обновляется в javascript.

Как я могу программно «подтолкнуть» свои данные к модели? (В моем реальном приложении я буду толкая данные с сервера через WebSockets/атмосфера)

Answer 1

Хорошо, я нашел ответ: завернуть $scope.foo['bar']++ в

Answer 2

Вы должны вызвать новый цикл digest , в котором Angular проверит все зарегистрированные часы и обновит представление для объектов, изменивших значение. Вы можете сделать это, вызвав $scope.$apply, что вызовет цикл дайджеста для вас.

setInterval(function(){ 
    $scope.$apply(function() { 
     $scope.foo.bar++; 
    }) 
}, 100); 

Answer 3

Если вы используете функцию углового интервала $, а не setInterval. Тогда вам не нужно будет называть $ scope. $ Apply.

angular.module("controllers", []) 
    .controller("FooController", function($scope, $interval) { 
     $scope.foo = {}; 
     $scope.foo['bar'] = 0; 
     $interval(function(){ 
      $scope.foo['bar']++; 
     }, 100); 
});