La création d’un Filtre en Angular 4

13 Oct La création d’un Filtre en Angular 4

Etape 1 :

On crée un fichier prettyprint.pipe.ts

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'prettyprint'
})
export class PrettyPrintPipe {
  transform(val) {
    return JSON.stringify(val, null, 2)
      .replace('é', 'é')
      .replace('’', "'");
  }
}

/*
Ce Pipe à le rôle de transformer é en é et ’ en '
*/

Etape 2 :

On intègre notre pipe dans app.module.ts

import { PrettyPrintPipe } from './inc/prettyprint.pipe';


@NgModule({
  declarations: [
    PrettyPrintPipe
  ],
  
  providers: [PrettyPrintPipe],
 
})
export class AppModule { }

Etape 3 :

Utilisation dans notre view :

{{ NOTRE_VARIABLE | prettyprint  }}