Funcionamento dos Pipes no Angular

Os pipes basicamente serão como uma espécie de filtro que funcionaram para coisas simples, como uma máscara para algum determinado campo, no angular em sua documentação oficial temos vários pipes já prontos basta apenas usar. Até aí tudo simples né? Mas como que usa?

{{ suaVariavel | pipe1 | pipe2 | pipeN }}

Dado o seguinte componente:

@Component({
  selector: 'hero-birthday',
  template: `<p>Seu nome é: {{ nome | uppercase }}</p>`
})
export class SeuComponent {
  nome: string = "lucas"
 }

 

Isso dará o seguinte resultado:

Seu nome é: LUCAS

Mas e se quiser utilizar mais de um pipe?

@Component({
  selector: 'hero-birthday',
  template: `<p>Seu nome é: {{nome| uppercase | lowercase}}</p>`
})
export class SeuComponent {
  nome: string = "lucas"

 }

Isso dará o seguinte resultado:

 Seu nome é: Lucas

Viu só bem simples né, gostou? não esqueça de compartilhar com os amigos

criticas e sugestões são sempre bem vindas

pica-pau4-g-20091215

Referencia

https://angular.io/docs/ts/latest/guide/pipes.html

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Blog at WordPress.com.

Up ↑

%d bloggers like this: