Question

我正在尝试在角度js中进行自动完成。但是当我在文本字段上键入任何内容时它不会反映在视图上。换句话说，在文本字段上键入后它不会给出过滤器列表。我有站名和站代码。我需要使用过滤器代码过滤我的列表。这是我的代码

当我输入“B”时，它应显示从“B”开始的站代码列表。你能告诉我我做错了吗？

<ion-content>
     <div class="list">
        <label class="item item-input">
            <span class="input-label">StationName</span>
            <input type="text" ng-model="station.stationCode" class="bdr">
        </label>
        </div>
    <div class="list">
        <li class="item" ng-repeat="station in data.data">{{station.stationName+"-("+station.stationCode+")"}}</li>
    </div>
</ion-content>

Answer 1

您实际上并没有过滤列表：

http://codepen.io/anon/pen/rVNBOO

补充：

 $scope.startsWith = function (actual, expected) {
    var lowerStr = (actual + "").toLowerCase();
    return lowerStr.indexOf(expected.toLowerCase()) === 0;
    };

并更改了ng-repeat：

ng-repeat="station in data.data | filter:station.stationCode:startsWith"

修改

startsWith中的代码获取实际值（在您的情况下为stationName）并检查它是否在字符串的开头找到搜索到的字符。如果indexOf“你的搜索字符串”是=== 0 - 则字符串以这些字符开头。

Answer 2

 <li class="item" ng-repeat="station in data.data | filter:station.stationCode">

这将允许列表根据文本框中的内容进行过滤。

注意：这将作为包含过滤器而不是StartsWith。

如何在angularjs中进行自动完成（过滤列表不显示）

2 个答案: