In this video we are going to learn about Pipes.
Pipe is used to transform data. It is denoted by symbol |.
Pipe takes integers, strings, arrays, and date as input separated with |.
It transforms the data in the format as required and displays the same in the browser.
Angular 10 provides some built-in pipes like:
Stringpipe,
Datepipe,
Currencypipe,
Jsonpipe,
Percentpipe,
Decimalpipe,
Slicepipe
So lets see how can we use pipe in Angular 10.
Before using pipes lets create some properties.
So go to the app.component.ts file and lets create properties.

fullName = \"Mark John\"; 
currentDate = new Date(); 
fruits= ['Mango', 'Orange', 'Apple', 'Pineapple','Banana']; 
user = {\"name\":\"Mark John\",\"age\":24, \"email\":\"mjohn@gmail.com\",\"Phone\":\"1234567890\"}

Now lets see the uses of pipe.
First of all see the string pipe So go to the app.component.html file.
Just write here.

{{fullName}} 

Now you can see here the name.
Now using pipe convert it into uppercase for that.
Just add the pipe sign here and just write here uppercase.

{{fullName | uppercase}}

Now you can see here the name is in the uppercase.
If we want to print name in lower case so for that just write here.

{{fullName | lowercase}}

Now you can see here name in lower case.
Now lets see the date pipe.
Just print the date so inside the currely brackete just type.

{{currentDate}}

Now you can see the current date.
Alright, if we want to print date in specific format.

{{currentDate | date:'d/M/y' }} 

Now you can 

see here the date is in the d M y format.

Now if we want to print time only.
Then just write here.

{{currentDate | date :'shortTime'}} 

You can see here the time.
Now lets see the json pipe.

{{user | json}} 

and here you can see the json formatted data.
Now lets see the currency pipe.
For that just write here the any amount.

{{25.12}} 

You can see the amount here.
If we want to print this amount with currency symbol.

{{25.12 | currency:'USD'}} 

Then just add the | sign here and in double quote currency name \"USD\".
Now you can see the $25.12.
Alright now lets see the decimal pipe.
For that.
Just write here a decimal value.

{{45.324234234}} 

Now you can see the this decimal.
Here if we want to display only 2 number after the point.

{{45.324234234 | number:'2.2-2'}} 
Now you can see the number. 
In last lets see the slice pipe. 
Here I am just going to print the array. 

{{fruits}} 

Now you can see the array. 
If we want to slice this array. 
For that just write here.

{{fruits | slice:1:3}} 

Now you can see here the sliced array , it sliced array from index 1 to 3. 
So in this way you can use pipes in angular 10.