formations/javascript/angular/filtres-1.md

959 B

.cadoles-slide-title[Les filtres (1/3)]

  • Les filtres permettent de formatter le résultat d'une expression afin de l'afficher à l'utilisateur.
  • Ils peuvent être utilisés dans les templates, dans les contrôleurs ou dans les services.
  • Angular fournit une liste de filtres par défaut, mais il est possible également de créer ses propres filtres.

Usage d'un filtre dans les expressions

<div ng-app ng-init="myStr = 'Hello World !'; myArr = ['item 1', 'item 2', 'item 3']">

  <!-- Syntaxe: expression | filtre[:arg1:arg2:...] -->

  <span>{{ myStr | uppercase }}</span> <!-- "HELLO WORD !" -->

  <!-- On peut chaîner les filtres -->
  <span>{{ myStr | uppercase | lowercase }}</span> <!-- "hello world !" -->

  <!-- On peut l'utiliser sur différents types de valeurs, par exemple un tableau -->
  <span>{{ myArr | limitTo:2 }}</span> <!-- ['item 1', 'item 2'] -->

</div>