Pipe

Pipes are simple functions that accept an input value and return a transformed value. They're easy to apply within template expressions, using the pipe operator (|)

<div>Title through uppercase pipe: {{title | uppercase}}</div>

• You can chain expressions through multiple pipes.

<div>
  Title through a pipe chain:
  {{title | uppercase | lowercase}}
</div>

• You can also apply parameters to a pipe

<div>Birthdate: {{currentHero?.birthdate | date:'longDate'}}</div>

Angular Pipes

Pipe API List

Date

<!--output '2015-06-15 05:03 PM GMT+9'-->
<p>The custom date is {{today | date:'yyyy-MM-dd HH:mm a z':'+0900'}}</p>

Self-define Pipes

A class with the @Pipe decorator defines a function that transforms input values to output values for display in a view.

[R] https://angular.io/guide/pipes