You can search name 'tiba', but area 'tiba' can not search.
name | codename | area |
---|---|---|
{{item.name}} | {{item.codename}} | {{item.area}} |
<div ng-controller="Ctrl"> <h1>AngularJS multiple ng-model filter</h1> <p>You can search <b>name</b> 'tiba', but <b>area</b> 'tiba' can not search.</p> <p><input type="text" ng-model="query"></p> <table class="table table-striped table-bordered"> <tr> <th>name</th> <th>codename</th> <th>area</th> </tr> <tr ng-repeat="item in items | filterMultiple:query"> <td>{{item.name}}</td> <td>{{item.codename}}</td> <td>{{item.area}}</td> </tr> </table> </div>
var app = angular.module('app', []); app.controller('Ctrl', ['$scope', function($scope) { $scope.items = [ {'name': 'sato', 'codename': 'foo', 'area': 'tokyo'}, {'name': 'suzuki', 'codename': 'bar', 'area': 'tiba'}, {'name': 'tiba', 'codename': 'baz', 'area': 'saitama'} ]; }]); app.filter('filterMultiple', [function() { return function (data, query) { if (query === undefined) return data; var results = []; angular.forEach(data, function(val) { if ((val.name).indexOf(query) > -1 || (val.codename).indexOf(query) > -1) { results.push(val); } }); return results; } }]);