Pipes

אפשר לשנות את הדרך שבה מוצג המידע בדף ה-html.

נגדיר משתנים לדוגמא:

ts file

public name = 'Dani';
public message = 'Welcome to the class';
public person = {
    firstName: 'John',
    lastName: 'Dou',
};
public date = new Date();

נראה את הניתובים של המידע

html file

Strings

<h2>{{ name | lowercase }}</h2>
<h2>{{ name | uppercase }}</h2>
<h2>{{ message | titlecase }}</h2>
<!-- Slicing with staring index -->
<h2>{{ name | slice:3 }}</h2>
<!-- Slicing with starting and ending index -->
<h2>{{ name | slice:3:5 }}</h2>
{{ person | json }}

Numbers

<!-- Give min numbers in the int and in the decimal place -->
{{ 5.678 | number: '1.2-3' }}
{{ 0.25 | percent }}
{{ 0.25 | currency }}
{{ 0.25 | currency: 'ILS' }}

Date

<h2>{{ date | date: 'short' }}</h2>
<h2>{{ date | date: 'shortDate' }}</h2>
<h2>{{ date | date: 'shortTime' }}</h2>