Skip to content

Comment utiliser le pipe percent sur Angular ?

Pensez à importer CommonModule

Vous devez importer le module CommonModule dans votre module principal en ajoutant l'instruction suivante à la liste des imports de votre module :

ts
import { CommonModule } from '@angular/common';

@NgModule({
  imports: [
    CommonModule
  ],
  // ...
})
export class MyModule { }
import { CommonModule } from '@angular/common';

@NgModule({
  imports: [
    CommonModule
  ],
  // ...
})
export class MyModule { }

Ensuite, vous pouvez utiliser le pipe percent dans votre template en le plaçant après une expression en utilisant le symbole |. Par exemple:

html
<!-- template -->
{{ value | percent }}
<!-- template -->
{{ value | percent }}

Cela va formatter la valeur value en pourcentage. Si vous souhaitez spécifier des paramètres de formatage, vous pouvez les passer au pipe en les incluant après le nom du pipe, séparés par des :. Par exemple:

html
<!-- template -->
{{ value | percent:'1.2-2' }}
<!-- template -->
{{ value | percent:'1.2-2' }}

Cela va formatter la valeur value en pourcentage avec une précision de deux chiffres après la virgule.

Les paramètres sont indentiques au pipe number