Manipulating data with pipes
Pipes allow us to filter and funnel the outcome of our expressions on a view level. They take data as input, transform it into the desired format, and display the output in the template. To better understand it, think of it like transforming a donkey into a unicorn:
Figure 4.2 – Conceptualized pipe transformation
The donkey may look like a unicorn, but it is always a donkey. That is, the transformation is applied only on a view level; the underlying data remains intact in its original form.
The syntax of a pipe is pretty simple, basically consisting of the pipe name following the expression that we want to transform, separated by a pipe symbol (hence the name). Pipes are usually used with interpolation in Angular templates and can be chained to each other. Angular has a wide range of pipe types already baked in:
- The
uppercase/lowercasepipes transform astringinto a particular case. The following snippet...