AngularJS - Load All Results on Page Before Filtering

Question

I have set up a custom filter – certFilter - that filters based on what is chosen from checkboxes that are dynamically generated. That works fine but I'm trying to figure how to load all the results on the initial page load, because right now none of the results display until you select what you want filtered.

<p ng-repeat="cert in allCerts">
   <input type="checkbox" ng-model="status"  
                          ng-change="ifCheck(filteredCerts, cert, status)"> {{ cert }}
</p>
<div ng-repeat="expert in expertList | certFilter:filteredCerts ">
   <h2>{{ expert.data.name }}</h2>
</div>

I'm not sure how to display all the results before filter options have been chosen. Any ideas?

Answer 1

If you want to disable filter till status checkbox model becomes true, you can return input list, something like:

<div ng-repeat="pro in poolProList | certFilter:{'fc':filteredCerts, 'status': status} ">

and:

app.filter('certFilter', function() {
   return function( items, settings) {
    var filtered = [];

   if(!settings.status){ // where "status" is ngModel of checkbox
      filtered = items;
   } 

    // ...
    return filtered;
  };
});