1

I am trying to implement multiple checkbox based filters and wondering if there is a better way to do so (something that wouldn't upset John Papa).

If I am working with Sodas and I want to filter by brand as a starting point I have this set up:

  <input type="checkbox" ng-model="vm.brands.Pepsi"> Pepsi
  <input type="checkbox" ng-model="vm.brands.Coke"> Coke
  <ul>
    <li ng-repeat="soda in vm.sodas | filter:vm.brandFilter">
      {{soda.name}}
    </li>
  </ul>

with my filter function being:

  function brandFilter(soda) {
      if (!vm.brands) {
        return soda;
      }
      var brand = soda.brand;
      if (vm.brands[brand] === true) {
          return soda;
      } else {
          return false;
      }
  }

Working Plunker

While this works I am hoping that there is a better/more production viable solution that can maintain DRYness considering I will be adding multiple 'groups' of checkboxes (if it were soda perhaps more object properties would be color, flavor, etc).

1

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.