Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>This happens because <code>_.groupBy</code> returns a collection of <em>new</em> objects every time it runs. Angular's <code>ngRepeat</code> doesn't realize that those objects are equal because <code>ngRepeat</code> tracks them by <em>identity</em>. New object leads to new identity. This makes Angular think that something has changed since the last check, which means that Angular should run another check (aka digest). The next digest ends up getting yet another new set of objects, and so another digest is triggered. The repeats until Angular gives up.</p> <p>One easy way to get rid of the error is to make sure your filter returns the same collection of objects every time (unless of course it has changed). You can do this very easily with underscore by using <code>_.memoize</code>. Just wrap the filter function in memoize:</p> <pre><code>app.filter("ownerGrouping", function() { return _.memoize(function(collection, field) { return _.groupBy(collection, function(item) { return item.owner; }); }, function resolver(collection, field) { return collection.length + field; }) }); </code></pre> <p>A resolver function is required if you plan to use different field values for your filters. In the example above, the length of the array is used. A better be to reduce the collection to a unique md5 hash string.</p> <p><a href="http://plnkr.co/edit/WLDQbExc69EaUkkasCwx?p=preview" rel="noreferrer">See plunker fork here</a>. Memoize will remember the result of a specific input and return the same object if the input is the same as before. If the values change frequently though then you should check if <code>_.memoize</code> discards old results to avoid a memory leak over time.</p> <p>Investigating a bit further I see that <code>ngRepeat</code> supports an extended syntax <code>... track by EXPRESSION</code>, which might be helpful somehow by allowing you to tell Angular to look at the <code>owner</code> of the restaurants instead of the identity of the objects. This would be an alternative to the memoization trick above, though I couldn't manage to test it in the plunker (possibly old version of Angular from before <code>track by</code> was implemented?).</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload