Question

我有一个列表，其页面上有一个搜索电台：

  <div class="btn-group" bs-buttons-radio ng-model="filter">
    <button type="button" value="all" class="btn span4">All</button>
    <button type="button" value="active" class="btn span4">Active</button>
    <button type="button" value="inactive" class="btn span4">Inactive</button>
  </div>

<div ng-repeat="u in (filteredUsers = (users | orderBy:'username' | offset: page*itemsPerPage | limitTo:itemsPerPage))" >
  <div>{{u.username}}</div>
</div>

我的用户对象如下所示：

{
  username: 'username',
  active: true
}

当对活动与非活动进行过滤时，我会执行以下操作：

<div ng-repeat="u in (filteredUsers = (users | filter:{active: filter} | orderBy:'username' | offset: page*itemsPerPage | limitTo:itemsPerPage))" >
  <div>{{u.username}}</div>
</div>

并且效果很好。

投掷所有＆＃39;进入混合使事情变得复杂。

有没有办法可以在html中应用过滤器，以便全部＆＃39;会给我活跃和不活跃的用户吗？

Answer 1

我同意@ JLRishe的回答，为了便于阅读，最好编写一个自定义过滤器函数，但为了完整起见，实际上可以将其写为过滤器表达式。

您的"all"仅表示您的过滤器不适用。为了使这项工作，对于undefined的情况（因此使过滤器无效），您的过滤器表达式应该返回"all"，而对于其他情况，则返回{active: filter}：

<div ng-repeat="u in users | filter: (filter != 'all' || undefined) && {active: filter}">
</div>

（我假设filter可以假设true | false | "all"）的值

plunker

Answer 2

自定义过滤器功能怎么样？

$scope.filterActive = function (user) {
    switch ($scope.filter) {
        case 'all': return true;
        case 'active': return user.active;
        case 'inactive': return !user.active;
    }
}

然后你可以使用：

users | filter:filterActive ....

您在示例中使用的对象语法只有在您将值与值匹配时才有意义。正如New Dev的回答所示，可以将＆＃34; all＆＃34;逻辑，但不是很干净。

复合过滤器不起作用

2 个答案: