CODEWITHSUNDEEP
javascriptangularjsangularjs-ng-repeat
Domi
Domi

Reputation: 24528

How to update the ng-repeat view of a list?

This simple fiddle displays a list using ng-repeat. But if I change the list from outside the DOM (in this case, using a timer), the list view does not get updated.

What do I have to do to fix this?

Upvotes: 0

Views: 63

Answers (1)

Morgan Delaney
Morgan Delaney

Reputation: 2439

Because you're calling setTimeout( fn ) from outside of Angular, the digest cycle doesn't know that the variable has been updated.

Try using Angular's $timeout service so that when the function is run, Angular will know to apply the digest cycle.

Updated example

Edit: example using $scope.$apply(), in case $timeout is not what's being used.

From the comments: "Yeah, you can run if(!$scope.$$phase) $scope.$apply(). There is also $scope.$digest if you're just digesting the local scope. JSFiddle"

Code example from within controller:

$scope.lines = lines;
setTimeout(function() {
    lines.push({text: 'new text'});
    console.log('Line added: ' + lines.length);
    if ( !$scope.$$phase ) $scope.$apply();
}, 1000);

Upvotes: 2

Related Questions