<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>
no idea what's wrong with my code, what I want to do is to filter out some names with the input.. like I enter "A", it display only "Adam"..
It will work with right data initialization:
<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>
You were calling the "name" but this attribute doesn't exist in your list. Then you can order by name (ASC) or -name (DESC) or use the reverse boolean field true or false.
nameList=['Adam','Rain','John',King]
Should be:
nameList=['Adam','Rain','John','King']
UPDATE
Oh, sorry. You mean's match the first words of the item? Shoule add a custom filter for it:
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;
}
});
Edit 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>
This works good: http://jsfiddle.net/R4WGp/1/
