search。$也搜索id

Question

Il跳到案子里。

基本上当你有一个像这样的对象数组时：

{id: 1, name: "Hello", location: "New york", streetNumber: 50}

然后你有一个输入字段：

<input type="text" ng-model="search.$" />

以下表格：

<table>
    <thead>
    <th>Name</th>
    <th>Location</th>
    <th>Street number</th>
    </thead>
    <tr ng-repeat="item in items | filter:search">
        <td>
            {{item.name}}
        </td>
        <td>
            {{item.location}}
        </td>
        <td>
            {{item.streetNumber}}
        </td>
    </tr>
</table>

因此，当您在搜索字段中输入内容时：＆＃34; 1＆＃34;。

然后你也会得到id匹配的对象。

我的问题是如何排除未显示的项目？

Fiddle

Answer 1

好吧，看看docs

  

可以使用特殊属性名称（默认为$）（例如{$：   ＆＃34; text＆＃34;}）接受对象或其对象的任何属性的匹配   嵌套对象属性。

这就是为什么包含id满足标准的结果的原因。

解决方案1，简单但工作速度较慢

添加其他过滤

<tr ng-repeat="item in items | filter : search | filter : { id: '!search.$' }">

解决方案2，困难但快速

考虑编写自己的过滤器，例如

JS

app.filter('searchFields', function () {
    return function (array, fields, string) {
        fields = fields.split(',');

        var i,
            fieldsLength = fields.length;

        return array.filter(function (item) {
            for (i = 0; i < fieldsLength; i++) {
                if (typeof item[fields[i]] === 'undefined') {
                    continue;
                }

                return (item[fields[i]] + '').indexOf(string) !== -1;
            }
        });
    };
});

HTML

<tr ng-repeat="item in items | searchFields : 'name,location,streetNumber' : search.$">