Generally, If you want to transform data in your Angular application, you write the code in the component. For example, if you want to transform today’s date into a format like ’20 May 2018′ or ’20-05-2018′, you would need to write the logic for that conversion in the component.

There’s a better way. Instead of writing separate boilerplate code, you can use the built-in pipe called DatePipe which will take input and transform it into the desired date format.

A pipe takes in data as input and transforms it to the desired output. It is very similar to a WPF Converter (IValueConverter).

Angular provides a number pipes out of the box. You can read about them in the Angular documentation:

https://angular.io/api?type=pipe

In this video, I show you how to use the built-in Angular Pipes to transform your data, and how to create your own custom Pipe to meet those app requirements where a built-in Pipe just won’t work.

Brian Lagunas

View all posts

Follow Me

Follow me on Twitter, subscribe to my YouTube channel, and watch me stream live on Twitch.