Refresh ng-repeat even nothing has changed

Question

I make some dom-manipulation inside a ng-repeat. Now I want to reset my DOM to match the model where ng-repeat is looping over. How can I force AngularJS to redraw the ng-repeat content.

Apply doesn't work obviously cause no changes where made to the model.

Answer 1

The whole idea of ng-repeat is that it follows the model. If you want to change the content you should really change the model. As for the dom-manipulations, you should perform those within an angular component or directive and again, make it follow the model.

If you're not doing that, you pretty much might as well not use Angular at all.

Answer 2

Actually you don't need to do any special things to re bind the DOM in angular js. Angular JS supports two way data binding, so when ever your model changes, the DOM object rebinds automatically with modified contents. So all you have to do is rebind your controller variable, that will automatically updates the DOM.

Answer 3

If you paste some code, would be great, but anyway for example lets say we have this:

$scope.rows = [1,2,3];

<div ng-repeat="row in rows">
   {{row}}
</div>

In order to redraw the same data with ng-repeat you need to somehow change the scope. You can try this after your DOM manipilation

$scope.rows = angular.copy($scope.rows);