Angular 2/4 - Apresentando o Angular CLI - VI
Neste artigo vou apresentar o Angular CLI a ferramenta de linha de comando para automatizar o desenvolvimento de aplicações Angular 2/4. Adicionando um novo pipe. |
Vamos continuar adicionando recursos em nossa aplicação Angular, criada na primeira parte do artigo, usando o Angular CLI.
Neste artigo vamos adicionar um novo pipe.
Pipes são o equivalente aos filtros do Angular 1 e permite que você transforme o valor exibido dentro de um template. O Angular 2 já vem com muitos pipes prontos para serem usados como DatePipe, UpperCasePipe, CurrencyPipe, etc.
Adicionando um novo pipe
Para adicionar um novo módulo chamado converterParaDolar em sua aplicação execute o seguinte comando : ng generate pipe converte-para-dolar
O
Angular CLI irá ajustar automaticamente as letras do nome do arquivo e do
nome do pipe para você, então os seguintes comandos têm o mesmo efeito:
ng generate pipe converte-para-dolar
ng generate pipe converteParaDolar
ng generate pipe ConverteParaDolar
Veja na figura abaixo o arquivo pipe converte-para-dolar.pipe.ts gerado na pasta src\app e
ao lado a classe ConverteParaDolarPipe criada neste arquivo:
Nos bastidores, acontece o seguinte:
- um
arquivo src/app/converte-para-dolar.pipe.ts é criado e nele é definida
uma classe chamada ConverteParaDolarPipe
- um
arquivo src/app/converte-para-dolar.pipe.spec.ts contendo os testes
unitários;
- A declaração ConverteParaDolar é adicionada em um decorator @NgModule
no módulo mais próximo, no caso, no arquivo src/app/app.module.ts
Opções disponíveis
--flat: boolean, default true, gera arquivos
de pipes em src/app ao invés de gerar em src/app/converte-para-dolar;
--spec: boolean, default true, inclui um
arquivo src/app/admin/admin.module.spec.ts com testes unitários;
--help : vê todas as opções disponíveis do
Angular CLI
Exemplo:
Gerar um pipe 'converteParaDolar' sem spec e na pasta
/src/app/convert-para-dolar: ng generate
pipe converte-para-dolar --spec=false --flat=false
No
próximo artigo vamos adicionar um service no projeto.
Porque todos quantos
fostes batizados em Cristo já vos revestistes de Cristo.
Nisto não há judeu nem grego; não há servo nem livre; não há macho nem fêmea;
porque todos vós sois um em Cristo Jesus.
Gálatas 3:27-28
Referências:
AngularJS - Conceitos Básicos - YouTube (série de 13 vídeo aulas sobre o Angular)
Visual Studio - Bem-Vindo Node.js : desenvolvendo para Node.js na plataforma .NET