AngularJS не обновляет изменения модели

Я пытаюсь выяснить, как работает Angular, и у меня возникают проблемы с обновлением моего представления при изменении модели.

HTML

<div ng-app="test">  
        <p ng-controller="TestCtrl">  
            {{testValue}}  
        </p>  
    </div>

var app = angular.module('test', []);

    app.controller('TestCtrl', function ($scope) {
       $scope.testValue = 0;

        setInterval(function() {
            console.log($scope.testValue++);
        }, 500);
    });

http://jsfiddle.net/N2G7z/

любые идеи?

Ответ 1

Как упоминалось выше в Ajay beniwal, вам необходимо использовать Apply для начала пищеварения.

var app = angular.module('test', []);

app.controller('TestCtrl', function ($scope) {
   $scope.testValue = 0;

    setInterval(function() {
        console.log($scope.testValue++);
        $scope.$apply() 
    }, 500);
});

Ответ 2

Просто используйте $interval

Вот ваш код изменен. http://plnkr.co/edit/m7psQ5rwx4w1yAwAFdyr?p=preview

var app = angular.module('test', []);

app.controller('TestCtrl', function ($scope, $interval) {
   $scope.testValue = 0;

    $interval(function() {
        $scope.testValue++;
    }, 500);
});

Ответ 3

setTimout выполняется за пределами angular. Для этого вам необходимо использовать службу $timeout:

var app = angular.module('test', []);

    app.controller('TestCtrl', function ($scope, $timeout) {
       $scope.testValue = 0;

        $timeout(function() {
            console.log($scope.testValue++);
        }, 500);
    });

Причина в том, что двусторонняя привязка в angular использует грязную проверку. Это хорошая статья, чтобы прочитать грязную проверку angular. $scope.$apply() запускает цикл $digest. Это применит привязку. $timeout обрабатывает $apply для вас, поэтому рекомендуется использовать эту функцию при использовании тайм-аутов.

По существу, привязка происходит во время цикла $digest (если значение считается другим).

Ответ 4

Не использовать $scope.$apply() angular уже использует его, и это может привести к этой ошибке

$rootScope: inprog Действие уже выполнено

если вы используете дважды, используйте $timeout или интервал