Filtering is really easy in Angular JS.
In Angular JS we use the “filter” keyword to do the filtering.
Example
<!DOCTYPE html><html><script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script><body><div ng-app="myApp" ng-controller="namesCtrl"><p>Search:</p><p><input type="text" ng-model="my_search"></p><ul> <li ng-repeat="name in names | filter:my_search"> {{ name }} </li></ul></div><script>angular.module('myApp', []).controller('namesCtrl', function($scope) { $scope.names = [ 'Google', 'Apple', 'Samsung', 'HTC', 'OnePlus', 'Sony' ];});</script><p>The list will only consists of names matching the filter.</p></body></html> |
Copy and paste the above code in an html and run. You will see the result.
Here we have a variable named “my_search” which is a textbox in HTML. so the filter value is taken from the textbox.
You can see the ng-model=”my_search” set in the textbox.