如何筛选angularJS多个值（OR操作） [英] How to filter multiple values (OR operation) in angularJS

问题描述

我想使用过滤器的角度和希望筛选多个值，如果有其中任何一种价值观之一，那么它应该被显示。

I want to use the filter in angular and want to filter for multiple values, if it has either one of the values then it should be displayed.

我有这样的例子结构：

对象电影拥有的财产类型我要筛选行动和喜剧。

An object movie which has the property genres and I want to filter for Action and Comedy.

我知道我可以做过滤器：（{流派：'行动'} || {流派：'喜剧'}），但是做什么，如果我想动态过滤。例如。 过滤器：variableX

I know I can do filter:({genres: 'Action'} || {genres: 'Comedy'}), but what to do if I want to filter it dynamically. E.g. filter: variableX

如何设置 variableX 在 $范围，当我有我的风格的数组过滤器？

How do I set variableX in the $scope, when I have an array of the genres I have to filter?

我可以构建它作为一个字符串，然后做一个的eval（），但我不想使用eval（）...

I could construct it as a string and then do an eval() but I don't want to use eval()...

推荐答案

我只是想创建一个自定义过滤器。他们并不难。

I would just create a custom filter. They are not that hard.

angular.module('myFilters', []).
  filter('bygenre', function() {
    return function(movies,genres) {
      var out = [];
      // Filter logic here, adding matches to the out var.
      return out;
    }
  });

模板：

<h1>Movies</h1>

<div ng-init="movies = [
          {title:'Man on the Moon', genre:'action'},
          {title:'Meet the Robinsons', genre:'family'},
          {title:'Sphere', genre:'action'}
       ];" />
<input type="checkbox" ng-model="genrefilters.action" />Action
<br />
<input type="checkbox" ng-model="genrefilters.family" />Family
<br />{{genrefilters.action}}::{{genrefilters.family}}
<ul>
    <li ng-repeat="movie in movies | bygenre:genrefilters">{{movie.title}}: {{movie.genre}}</li>
</ul>

修改这里是链接：创建角过滤器

的更新的：这是一个小提琴有我的建议的精确演示。

UPDATE: Here is a fiddle that has an exact demo of my suggestion.

这篇关于如何筛选angularJS多个值（OR操作）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！