Angular JS Error: Iteration reached $ 10 digest (). Aborting

Question

I am using angularjs-google-maps and I get an error when trying to block my clients as markers on the map.

<map> <custom-marker ng-repeat="cust in customers" position="[ {{ cust.lat }}, {{ cust.lon }} ]"> <div class="{{ cust.category }}">{{ cust.name }}</div> </custom-marker> </map> 

The error seems to be related to cust.category and cust.name , since they work fine when deleted.

This is the first couple of lines of the error message I get:

 Watchers fired in the last 5 iterations: [["[ cust.category , cust.name ]; newVal: [\"pro\",\"Fred\"]; oldVal: [\"pro\",\"Fred\"]","fn: function (context) {\n try {\n for(var i = 0, ii = length, part; i<ii; i++) {\n 

Full error message here .

Any help with this is appreciated. Thanks in advance!

UPDATE

The code for the custom marker directive is that part of angular-google-maps is here .

Answer 1

It seems like the digest loop is stuck in the loop. Angular has a digest loop in which they scan models (no matter what is in the $ scope area) and apply changes to the views if the models change. If in a digest cycle you perform some function that changes the value again, you start another digest cycle, which starts the same function again, changes the value of the model and starts an endless cycle of digest cycles.

However, you might want to add code for your customMarker directive for more accurate answers.

Answer 2

why you are binding class = "{{cust.category}}", try using ng-class. You can also use the track at $ index in ng-repeat. I was getting this error when starting my ios9 ionic application. They released a fix to fix this.

Answer 3

Code like this:

 scope.$watch('[' + varsToWatch.join(',') + ']'... 

looks like "[obj1.prop, obj2.prop]" after concatenation.
Expressions like this are parsed by $parse and force themselves to be evaluated in a new instance of the array at each iteration, even if nothing has changed inside.

You must interpolate / analyze it before calling $watch and write a condition that has changed only compared to the corresponding data.

---

$watch is function(watchExp, listener, objectEquality, prettyPrintExpression)
You can try using the third parameter ( objectEquality ) to compare arrays by value, but not by reference equality.

 @param {boolean=} objectEquality Compare for object equality using {@link angular.equals} instead of comparing for reference equality.