Référence : https://angular.io/guide/pipes

Les  "pipes" sont utiles pour transformer des chaînes, des montants de devises, des dates et d'autres données à afficher.

Les "pipes" sont des fonctions simples à utiliser dans les expressions de modèle pour accepter une valeur d'entrée et renvoyer une valeur transformée. Les pipes sont utiles car vous pouvez les utiliser tout au long de votre application, tout en ne déclarant chaque pipe qu'une seule fois. Par exemple, vous utiliseriez une "pipe" pour afficher une date au 15 avril 1988 plutôt que le format de chaîne brute.

Angular fournit des canaux intégrés pour les transformations de données typiques, y compris les transformations pour l'internationalisation (i18n), qui utilisent les informations locales pour formater les données. Les "pipes" intégrées suivants sont couramment utilisés pour le formatage des données :

Pipes Details
DatePipe Formate une valeur de date selon les règles locales.
UpperCasePipe Transforme le texte en majuscules.
LowerCasePipe Transforme le texte en minuscules.
CurrencyPipe Transforme un nombre en une chaîne monétaire, formatée selon les règles locales.
DecimalPipe Transforme un nombre en une chaîne avec un point décimal, formaté selon les règles locales.
PercentPipe Transforme un nombre en une chaîne de pourcentage, formatée selon les règles locales.

Pipe Custom

Il est également possible de créer ses propres "pipes".

La commande Angular-Cli à utiliser :

ng generate pipe myCustomDate

Vous pourrez vous aider du package date-fns

npm install --save-exact date-fns

Exercice

Mettre en place une nouvelle "pipe" qui affichera en français le nombre de jours, d'heures et de minutes avant une date donnée.