#native_company# #native_desc#
#native_cta#

Overview

Pipes are used to transform data, when we only need that data transformed in a template.

If we need the data transformed generally we would implement it in our model, for example we have a number 1234.56 and want to display it as a currency such as $1,234.56.

We could convert the number into a string and store that string in the model but if the only place we want to show that number is in a view we can use a pipe instead.

We use a pipe with the | syntax in the template, the | character is called the pipe character, like so:

{{ 1234.56 | }}
{{ 1234.56 | currency : 'USD' }}

This would take the number 1234.56 and convert it into a currency string for display in the template like USD1,234.56.

We can even chain pipes together like so:

{{ 1234.56 | currency: 'USD' | lowercase }}

The above would print out usd1,234.56.

Tip

Pipes are just like filters in Angular 1

In this section you will learn:

  • How to use the set of built-in pipes provided by Angular.

  • How to create your own custom pipes.


Caught a mistake or want to contribute to the book? Edit this page on GitHub!



Advanced JavaScript

This unique course teaches you advanced JavaScript knowledge through a series of interview questions. Bring your JavaScript to the 2021's today.

Level up your JavaScript now!