自定义过滤器不会更新 iPhone 上的实时结果答案

【问题标题】：custom filter won't update live results on iPhone自定义过滤器不会更新 iPhone 上的实时结果
【发布时间】：2014-12-03 06:56:00
【问题描述】：

更新： Here's a plunkr

我有一个基本搜索字段，它显示来自员工数据 JSON 数组的匹配名称：

<form>
    <label>Enter name: <input type="text" ng-model="search"></label>
</form>

<ul class="result-container" ng-if="search.length>1">
    <li class="result" ng-repeat="emp in employees | filter:{full_name:search}">
</ul>

这很好用，但是因为它是移动的，所以我想尽可能减少 JSON 下载的大小。由于full_name 字段是作为first_name 和last_name 的串联动态创建的，因此如果我可以同时搜索名字和姓氏，我可以完全从JSON 中删除该字段。

所以我创建了一个自定义过滤器：

app.filter('firstAndLastName', function() {
    return function(collection, str) {
        return collection.filter(function(el) { // javascript array.filter()
            return (el.first_name.toLowerCase().indexOf(str) !== -1 || el.last_name.toLowerCase().indexOf(str) !== -1);
        });
    };
});

并更新了我的视图以使用它：

    <li class="result" ng-repeat="emp in employees |  firstAndLastName:search">

这在我的桌面浏览器上按预期工作——结果在输入文本时实时更新。但在移动设备上，无论键盘是否打开，它都不再显示任何结果。这在 Safari 和 Chrome (iOS 8.0.2) 中都会发生。

我试过making my filter stateful，但这并没有改变任何东西。（我目前正在使用 AngularJS 1.3.0-rc.4。）

为什么 AngularJS 内置过滤器会更新实时结果，而我的自定义过滤器却没有？为什么这只会发生在移动设备上？

【问题讨论】：

我很确定您已经尝试过了，但是您是否尝试过清除移动浏览器的缓存？
顺便说一句，这样做的最终目标是允许我从 JSON 中删除“全名”字段，将其大小减少 20-25%。

标签： ios angularjs angularjs-filter

【解决方案1】：

您是否尝试过确保输入和搜索字符串都设置为小写：

app.filter('firstAndLastName', function() {
    return function(collection, str) {
        var strToLower = str.toLowerCase();
        return collection.filter(function(el) { // javascript array.filter()
            return (el.first_name.toLowerCase().indexOf(strToLower) !== -1 || el.last_name.toLowerCase().indexOf(strToLower) !== -1);
        });
    };
});

我意识到我的手机自动将第一个字母大写，导致结果不显示。如果不是这样，您可能需要提供更多关于数据如何进入那里的信息。

【讨论】：