$rootScope:infdig error caused by filter?

Question

I'm doing a filter on an array in an ng-repeat.

div.row(ng-repeat="log in logs | prepare_log | orderBy: 'log.created'")

In the prepare_log filter I'm doing this:

value.stack_trace = angular.fromJson(value.stack_trace)

If I change it to this:

value.stack_trace = angular.fromJson(value.stack_trace).reverse()

I get the infdig error.

I don't know if it's relevant, but I'm iterating over the stack_trace property in an inner ng-repeat.

Any ideas what I'm doing wrong here?

Answer 1

You are causing an infinite $digest loop because you are changing the model during the digest loop.

What happens behind the scenes is this:

• ng-repeat parses the collection expression to figure out what rows need to be 'stamped' out and instantiates a watcher to get notified when the collection changes

• every time the filter is run, you change one of the items by assigning a new value to value.stack_trace, triggering the watcher of the ng-repeat to pick this up and starting over and over again

• Angular detects the loop and aborts

To solve the problem avoid changing the model in your filter.

Hope that helps!

Answer 2

because angular will always trigger digest one more time to make sure there is no more changes. in every digest cycle prepare_log filter will be called and return a value. if return value is the same from last one, it means no more changes and the application state is stabilized, thus angular does not have to trigger an extra digest.

but in your filter, value.stack_trace will be reversed in every digest cycle, thus the application state is never stabilized, which causing infdig (infinite digest) error.