Tuesday, 10 September 2013

Prepare array of objects before passing it to Angularjs ng-repeat to avoid '10 $digest() iterations reached' error

Prepare array of objects before passing it to Angularjs ng-repeat to avoid
'10 $digest() iterations reached' error

I have a following ng-repeat in my view:
<div ng-repeat="field in fields">
{{field.someValue}}
</div>
The content of fields needs to be preprocessed before it is given to the
view. So in my controller I have a function that loops through the fields
object and adds some keys and removes some keys. A simplified pseudocode
would look like that
myApp.controller('FieldsController', function($scope) {
$scope.fields = loadFieldsFromResource();
var i=0;
for(i = 0, i < $scope.fields.length, i++) {
if ($scope.fields[i].someProperty > maxValue) {
$scope.fields.splice(i,1);
}
else if ($scope.fields[i].someProperty < minValue) {
$scope.fields.splice(i,0,createNewField());
}
}
})
Now this gives me the 10 $digest() iterations reached. error. How can I
make it work? (I only need the preprocessing done on init).
I've tried to copy the fields with angular.copy() to a temporary variable.
Do the preprocessing on it and then assigning it to the fields variable
but still I get the same error.
Is there a way of doing this sort of preprocessing outside of the Angular
watch before I give it to the view?

No comments:

Post a Comment