Filters can do three different things, format, sort and filter data.

Filter can be used within a binding expression or a directive, to apply filter we use pipe ( | ) character.

Some of the common data filters are :

• lowercase
• uppercase
• number
• currency
• date

Let’s understand with date filter

date Filter :

In the above code we are getting current date from are system using $scope.date variable, this date variable format is Sun Jan 09 2022 10:40:24 GMT+0530 (India Standard Time).

Now to format this in readable format we will use date pipe.

After using this date pipe our output will be Date : 01/09/2022.

This is my current date of writing this blog.

There are different formats for date pipe.

• yyyy = 4 digit year like 1990
• yy = 2 digit like if its 1990 then it will display 90
• MMMM =January to December.
• MMM = 01-12
• M = 1-12
• dd = 01-31
• d = 1-31

limitTo Filter :

This filter can be used to limit the number of characters in a string.

In this example we have a message variable with a string “This is a message to test limit filter”.

With limitTo filter we can get part of string by assigning a limit value and begin value.

{{expression | limitTo : limit : begin}}

In our program we are assign limit to 15 and begin to 0. The index value of a string is always starts with 0 so output of this program will be “Message : This is a messa”.

index value of 15 is limit to this filter so the string will cut at 15 index. which is a of messa in output.

orderBy Filter :

We use this filter to sort the data.

For example

To sort in ascending order set reverse to false to sort in a descending order set reverse to true.