Solution of infinite digest loop for ng-repeat with object property filter in AngularJS

Few months ago I wrote a code in AngularJS which was something like this:


<ul ng-repeat="course in courses|filter:{is_taken:true }" >
<li>{{ course.name }}</li>
</ul>

 

It was generating a digesting loop error. Though the data was showing correctly. Soon I realized that it was generating because for each turn in ng-repeat loop, courses are filtered up. So, it was watched and digest by default characteristics of angular Scope. In this situation the easiest solution to me was following:


<div ng-init="filteredCourses=courses|filter:{is_taken:true }">
<ul ng-repeat="course infilteredCourses" >
<li>{{ course.name }}</li>
</ul>
</div>

 

What I did was I initiated a new object using ng-init which contains the filtered objects. Then use that newly created object to loop on. And all those errors are gone… 🙂

Like
Like Love Haha Wow Sad Angry

2 thoughts on “Solution of infinite digest loop for ng-repeat with object property filter in AngularJS

  1. Hey i try to make your solution

    {{hf.name}}

    What I am doing wrong search filter is not working, in my project it is important to do filtering in ng-init, it is possible?

    As i understood you did filtering on ng-init, maybe can you tell me what i do wrong?

    • Hi, not sure if you still have this problem. You said your “filter is not working”. It will be better if you can give me a little bit more detail about your problem so that we can figure it out. 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *