What are AngularJS Filters?

Filters in AngularJS are used to format/modify/transform the data displayed in the view, filters are used with expressions and directives like ng-bind, ng-repeat etc which are used to display model data in the view.  Filters are come in handy and can help us reduce lot of string manipulation when used in the right places.

Filters are prefixed by a | symbol, after the model object/variable, the following is the syntax to use filters with expressions.

{{<> | }}

AngularJS provides various predefined filters to modify source data, the following are some of the key filters provided by AngularJS

currency                 -        Used to format currency

orderby                  -        Used to sort elements in an array/collection

date                       -        Used to format data

filter                       -        Used to filter specific elements from and array

uppercase/lowercase -        Used to change the case of strings

html                       -        Used to prevent Angular from escaping HTML characters

json                       -        Used to convert JavaScript objects to JSON

number                   -        Used to format numbers

linky                       -        Used to convert links into HTML link tags

Apart from the above pre-defined filters we can also create custom filters and apply them on expressions.