javascript - AngularJS search filter weird behavior -
i'm building simple angularjs application. have array of objects, e.g.
this.properties = [{ "name": "jumbo", ... }, { "name": "denegin keskikankaantie 9 koy" ... }, ...] less 100 objects in total. i've build simple search input:
<input type="text" ng-model="vm.searchquery" /> and used inside ng-repeat directive:
<p ng-repeat="property in vm.properties | filter:vm.searchquery"> {{::property.name}} </p> i did before , worked in other applications. tried filter:{name: vm.searchquery}.
it has strange behavior, doesn't show properties searchquery, e.g. if type jumbo, isn't shown, but... of them shown, e.g. denegin keskikankaantie 9 koy shown if vm.searchquery === "jumbo". it's absolutely random time.
does know might reason this?
update:
i've updated plunker comments data (plunker). works perfectly. works on local server well. works users in production. have no idea, should work. i'm interested , trying figure out why doesn't.
final update: problem found
sorry, have looked @ code in production , notice track $index in ng-repeat directive. reason strange behaviour. removing fixed problem.
i'm not sure if should keep question because there mistake in original question, ng-repeat directive:
<p ng-repeat="property in vm.properties | filter:vm.searchquery track $index> {{::property.name}} </p>
html
<body ng-app> <div ng-controller="controller"> city: <input type="text" ng-model="name"><br> order by: <a href="" ng-click="predicate = 'name'">name</a> <a href="" ng-click="predicate = 'polulation'">population</a> <ul> <li ng-repeat="city in cities | filter: name | orderby: predicate"> {{ city.name }} | {{ city.population }} </li> </ul> </div> </body> javascript
function controller($scope){ $scope.cities = [ {name: "shanghai", population: "16 060 307"}, {name: "lagos", population: "13 969 284"}, {name: "karachi", population: "13 907 015"}, {name: "istanbul", population: "12 478 447"}, {name: "mumbai", population: "12 111 194"}, {name: "moscow", population: "11 821 873"}, {name: "são paulo", population: "11 716 620"}, {name: "beijing", population: "11 070 654"}, {name: "guangzhou", population: "11 007 835"}, {name: "delhi", population: "10 520 000"}, {name: "lahore", population: "10 467 400"}, {name: "shenzhen", population: "10 442 426"}, {name: "seoul", population: "9 761 407"}, {name: "jakarta", population: "9 341 844"}, {name: "tianjin", population: "8 981 087"}, {name: "chennai", population: "8 967 665"}, {name: "tokyo", population: "8 922 949"}, {name: "cairo", population: "8 906 039"}, {name: "dhaka", population: "8 873 017"}, {name: "mexico city", population: "8 859 036"}, {name: "lima", population: "8 754 000"}, {name: "kinshasa", population: "8 425 970"}, {name: "bangalore", population: "8 336 697"}, {name: "new york", population: "8 308 369"}, {name: "london", population: "8 280 925"}, {name: "bangkok", population: "8 244 535"}, {name: "tehran", population: "8 220 237"}, {name: "dongguan", population: "7 776 845"}, {name: "bogotá", population: "7 681 700"}, {name: "ho chi minh city", population: "7 310 691"}, {name: "faisalabad", population: "7 108 100"}, {name: "hong kong", population: "6 844 100"}, {name: "hanoi", population: "6 809 970"}, {name: "hyderabad", population: "6 434 373"}, {name: "wuhan", population: "6 429 923"}, {name: "rio de janeiro", population: "6 151 622"}, {name: "foshan", population: "6 150 000"}, {name: "baghdad", population: "5 570 585"}, {name: "ahmedabad", population: "5 399 200"}, {name: "singapore", population: "5 391 028"}, {name: "shantou", population: "5 188 286"}, {name: "riyadh", population: "5 131 967"}, {name: "saint petersburg", population: "5 112 018"} ]; $scope.predicate = 'population'; }
Comments
Post a Comment