How to filter multiple values (OR operation) in angularJS with checkbox

by

Use a filter function:

View:

<ul ng-repeat="movie in movies | filter: showMovie">
    <li>{{movie.name}}</li>
</ul>

Controller:

$scope.showMovie = function(movie){
    return movie.genre === $scope.Filter.Comedy || 
        movie.genre === $scope.Filter.Drama ||
        movie.genre === $scope.Filter.Action;
};

Fiddle

More Related Contents:

  1. ng-repeat :filter by single field
  2. filters on ng-model in an input
  3. Descending order by date filter in AngularJs
  4. Limit the length of a string with AngularJS
  5. Using AngularJS date filter with UTC date
  6. ng-model for “ (with directive DEMO)
  7. angularjs 1.6.0 (latest now) routes not working
  8. How to iterate over the keys and values with ng-repeat in AngularJS?
  9. AngularJS execution order with `$q` — Chaining Promises
  10. Can you override specific templates in AngularUI Bootstrap?
  11. Angular and SVG filters
  12. Confusing $locationChangeSuccess and $stateChangeStart
  13. Angular pass callback function to child component as @Input similar to AngularJS way
  14. How to parseInt in Angular.js
  15. AngularJS Group By Directive without External Dependencies
  16. AngularJS data bind in ng-bind-html?
  17. Angular orderBy number sorting as text in ng-repeat
  18. AngularJS – Multiple ng-view in single template
  19. What is the difference between required and ng-required?
  20. How to trigger a method when Angular is done adding scope updates to the DOM?
  21. Model in a modal window in angularjs is empty
  22. AngularJS $q. Deferred queue
  23. angularjs custom filter to check for values inside a data array
  24. Angular.js programmatically setting a form field to dirty
  25. How to detect browser using angularjs?
  26. How can I preserve new lines in an AngularJS partial?
  27. Exclamation mark after hash (#!) in angularjs app
  28. XMLHttpRequest cannot load and Response for preflight has invalid HTTP status code 405
  29. Prepend optional attribute in angular ui-router URL
  30. E2E mock $httpBackend doesn’t actually passThrough for me

Leave a Comment