Angular pipes

Text version of the video

Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help.

Slides

Angular 2 Tutorial playlist

Angular 2 Text articles and slides

All Dot Net and SQL Server Tutorials in English

All Dot Net and SQL Server Tutorials in Arabic

In this video we will discuss Pipes in Angular with examples.

Pipes in Angular
1. Transform data before display
2. Built in pipes include lowercase, uppercase, decimal, date, percent, currency etc
3. To apply a pipe on a bound property use the pipe character " | "

We can also chain pipes

Pass parameters to pipe using colon " : "

Custom pipes can be created

To read more about angular built-in pipes

Please note : If you get the following error, chances are that your date is not in mm/dd/yyyy format. To fix this error please change the date format to mm/dd/yyyy or create a custom pipe
InvalidPipeArgument: '14/10/1980' for pipe 'DatePipe'

Angular Pipe Examples:

uppercase pipe in this example converts employee code to uppercase

In this example, we have chained date and uppercase pipes.

In this example we are passing a single parameter to date pipe. With the parameter we specified we want the date format to be dd/mm/yyyy

For the list of date pipe parameter values please check the following article

In this example we are passing 3 parameters to the currency pipe

1. The first parameter is the currencyCode
2. The second parameter is boolean - True to display currency symbol, false to display currency code
3. The third parameter ('1.3-3') specifies the number of integer and fractional digits

[zeyonghuang]

i am chinese, i come from china. i have not been to any other country.
i just like to use vpn to visit google or youtube, studying some technology.
our chinese people said, proctect my country , Not allowed to use vpn.
our teachers can not teach like these videos which are very useful and very clearly.
i am sad, and maybe in the next hour, i can not visit youtube.

[Nulajo]

Can you please make a video about collecting data using a Web Api.
So collect data from a Sql server database.
The videos are very good, i learn a lot from it.

[choudharymustansar]

The currency pipe has been changed in Angular v5. The symbolDisplay option (third parameter) is now a string instead of a boolean. The accepted values are "code", "symbol" or "symbol-narrow"

[tilktovigourr]

Dear Venkat, ,, what Programming language do you suggest me for getting recently good job !

[amitkishor]

how to canected data from ms .SQL plz tell me...

[NooOnee]

Hello Sir,
Is PIPE sand Filters are same?

[Brand]

can you fix your microphone? it's clipping