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

https://stackoverflow.com/a/18243147/1466430

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;
};

AngularJS过滤精确匹配

3 个答案: