10 Digest iterations reached, aborting (scope function issue)

Question

I have pieces of data that come back in a very strange form (A single string representing all the choices/labels of a radio button group).

Example:

"yes|Yes no|No"

Because of this, I have to transform it into an array of pair objects. I do this with a function on my controller that iterates over the data one splitting on the newline character and then for each item in that array, it creates a pair obj with a value and a label attribute then pushes it into an array. At the end of the function, the final array is returned. The result would look like

[{value:"yes", label:"Yes"},{value:"no"|label:"No"}]

my markup looks like the following:

<div ng-repeat="item in function(dataObj)"></div> 

I know this error is occurring because angular expects the same object to return twice, as per other topics with similar issues. However, I don't see how to fix this issue.

As of right now, the function is actually working flawlessly, but I don't want to leave the error in..

Answer 1

Ng-repeats are constantly evaluated on every digest cycle - which means your function will be called over and over. You are creating a new object on every cycle, which causes angular to keep reevaluating, leading to the problem you've explained (full explanation here). Ideally you should always be calling ng-repeat against static data:

$scope.data = function(dataObj);

And setting your markup as:

<div ng-repeat="item in data"></div>