Using pipe(|) character Filters of AngularJS are used to change the data in directives. This selects a subset of items from array and returns it as a new array. An AngularJS filter formats the value of an expression for display to the user. They can be used in view templates, controllers or services. It is easy to create your own filter.
{{ filter_expression | filter : expression : comparator : anyPropertyKey}}
{{ filter_expression | filter }}
{{ filter_expression | filter1 | filter2 | … }}
{{ filter_expression | filter:argument1:argument2:… }}
Here are list of filters below:
To show name in all capital letters use uppercase filter.
Name: {{name.fullName() | uppercase}} To show name in all lowercase letters use lowercase filter.
Name: {{name.fullName() | lowercase}} You can use currency filter to show price using currency format.
Salary: {{name.salary | currency}} To order name by alphabet, you can use orderBy.
Name:<ul>
<li ng-repeat="fullname in name.firstName | orderBy:'firstName'">
{{ fullname.firstName }}
</li>
</ul> Read Also: AngularJS Scopes
To display only required name, we’ve used subjectName as filter.
Enter name: <input type=”text” ng-model=”userName”>
Name:<ul>
<li ng-repeat="fullname in name.firstName | filter: userName">
{{ fullname.firstName }}
</li>
</ul> Are you an owner of a small business who’s trying to come up with ways…
Introduction When patients bring me their lab reports, the confusion is almost always the same.…
Are you excited about remodeling your house after a long time? Perhaps if you're planning…
The practice of yoga teaches us to be present, patient and mindful of our decisions.…
As we are once again allowed to go outside, nearly everyone is planning to go…
How do you find a cleaning company that will take excellent care of your business…