AngularJS过滤精确匹配

Question

我需要按类别过滤项目列表.我希望用户能够单击按钮,然后将过滤器应用于列表.

目前,我的工作达到了一定程度.

比方说,我有一个电影列表,如下所示:

<li ng-repeat="movie in movieList | filter:filters">{{ movie.title }}</li>

我还有一个电影类型列表(呈现为按钮,点击时会过滤电影列表),如下所示:

<li ng-repeat="genre in genres">
    <a ng-click="filters.genre = genre.name" ng-click='changeGenre(genre.name)'>{{genre.name}}</a>
</li>

(所有'changeGenre()'函数都会更新范围以显示当前正在查看的类型).

现在这个工作很好,直到我遇到这样的情况,比如我有两种类型:'动作'和'动作冒险'.当我使用"动作"类型的电影进行过滤时,我不仅会获得动作电影列表,还会获得动作冒险电影.

有没有办法可以使用过滤器获得完全匹配？

Answer 1

现在,这在过滤器中原生提供.您可以将true传递给过滤器以启用严格匹配.

<li ng-repeat="movie in movieList | filter : filters : true">{{ movie.title }}</li>

Refereces

https://docs.angularjs.org/api/ng/filter/filter

/sf/answers/1277020321/

Answer 2

如果有人想在JavaScript端使用过滤器,你可以这样做:

$scope.filtered = $filter('filter')($scope.movieList, { genre.name: filters.genre}, true);

注意结尾处的真实...它表示是搜索完全匹配.

Answer 3

filter也可以使用一个可以实现自己的过滤器的功能.我做了一个动画片来展示它:http://plnkr.co/edit/v0uzGS？p = preview

这是相关的代码:

$scope.ChooseGenreFunction = function(genre) {
  $scope.filters = function(movie) {
    return movie.genre === genre;
  };
};
$scope.ChooseGenreString = function(genre) {
  $scope.filters = genre;
};