Question

<body ng-app>
    <div class="container" ng-init="nameList=['Adam','Rain','John',King]" ng-model="nameList">
        <input type="text" ng-model="nameText" />
        <ul>
            <li ng-repeat="name in nameList | filter:nameText | orderBy:'name'">{{name}}</li>
        </ul>
    </div>
</body>

不知道我的代码出了什么问题，我想做的是用输入过滤掉一些名字..就像我输入“A”一样，它只显示“Adam”..

Answer 1

它适用于正确的数据初始化：

<body ng-app>
    <div class="container" ng-init="nameList=[{name:'Adam'},{name:'Rain'},{name:'John'},{name:'King'},{name:'Adbm'}]" ng-model="nameList">
        <input type="text" ng-model="nameText" />
        <ul>
            <li ng-repeat="n in nameList | filter:nameText | orderBy:'name':false">{{n.name}}</li>
        </ul>
    </div>
</body>

您正在调用“名称”，但您的列表中不存在此属性。然后您可以按名称（ASC）或-name（DESC）排序，或使用反向布尔字段true或false。

Answer 2

nameList=['Adam','Rain','John',King]

应该是：

nameList=['Adam','Rain','John','King']

<强>更新

哦，抱歉。你的意思是匹配项目的第一个单词？ Shoule为其添加自定义过滤器：

angular.module("app", [])
.filter("matchfirst", function() {
  return function(input, filter) {
      if (!input) return input;
      if (!filter) return input;
    var result=[]
    filter=filter.toLowerCase()
    for (i=0;i<input.length;i++){
        if (input[i].toLowerCase().indexOf(filter)==0) {
            result.push(input[i]);
        }
    }
    return result;
  }
});

修改HTML：

<body ng-app='app'>
    <div class="container" ng-init="nameList=['Adam','Rain','John','King']" ng-model="nameList">
        <input type="text" ng-model="nameText" />
        <ul>
            <li ng-repeat="name in nameList | matchfirst:nameText | orderBy:'name'">{{name}}</li>
        </ul>
    </div>
</body>

这很有效：http://jsfiddle.net/R4WGp/1/

ng-repeat与init angularjs没有任何关系

2 个答案: