Question

我有一个有角度的应用程序，我正在显示一个人的列表。我有一个输入，我用来根据输入中的字符串过滤列表。

列表中的每个人都有一个status字符串。我在字符串过滤器旁边添加了一个复选框，但我不确定如何将其应用于我的过滤。

我希望字符串可以过滤名字/姓氏，而复选框可以过滤状态

搜索过滤器的绑定方式如下：

input type='text' ng-model='filterText'/>
<input type='checkbox'/> <!-- how do I get this to work -->
    <ul>
        <li ng-repeat='person in people | filter:filterText'>
            <span class=''>{{person.firstname}}</span>
            <span class=''>{{person.lastname}}</span> -
            <span class='color-oj'>{{person.status}}</span>

        </li>
    </ul>

$scope.people = [
        {firstname: 'abdul', lastname: 'ahmad', status: 'active'},
        {firstname: 'mahmud', lastname: 'samrai', status: 'active'},
        {firstname: 'gasser', lastname: 'badawi', status: 'inactive'},
        {firstname: 'ibtihaj', lastname: 'jasim', status: 'active'},
        {firstname: 'abudi', lastname: 'ahmad', status: 'inactive'},
        {firstname: 'ahmad', lastname: 'jasim', status: 'active'},
        {firstname: 'abdul', lastname: 'samrai', status: 'inactive'}
    ];

Answer 1

此代码基于您的小提琴，与您在此处发布的内容略有不同。

首先，给你一个模型复选框：

<input type='checkbox' ng-model='active'/>

其次，稍微更改过滤器：

<li ng-repeat='person in people | filter:filterText | filter:{isActive:active} '>

最初active未定义，因此显示所有人。选中后，active复选框将显示一个值，并相应地进行过滤。

Demo Fiddle

Answer 2

如果您有多个字段，则可以使用严格搜索。

<input type='checkbox' ng-model='search.isActive'/>
<input type='checkbox' ng-model='search.anotherField'/>

创建一个对象，其字段名称与您要过滤的对象上的字段匹配

<li ng-repeat='person in people | filter:filterText | filter:search:strict '>

搜索和复选框上的角度过滤器

2 个答案: