Angular Modules
Módulos são arquivos que ajudam a organizar a aplicação (modularização). São importantes pois podemos organizar melhor os diretórios e consequentemente os códigos ficam mais claros.
O app.module.ts é o módulo raiz da aplicação, dentro dele estão importados outros módulos:
BrowserModule → prepara a aplicação para ser executada em um browser.
FormsModule → formulários (muitas diretivas fazem parte desse módulo).
HttpModule → contém objeto http que usamos para fazer requisição.
@NgModule é onde a classe é decorada (decorator que é importado do angular/core)
O principal componente é o app.component.html, nele é onde declaramos as rotas, declaramos ou chamamos o menu da nossa aplicação.
Criando um módulo
No terminal digitamos : ng g m “nomedomodulo”
Get Thamiris Adriano’s stories in your inbox
Join Medium for free to get updates from this writer.
Nesse módulo de funcionalidade não terá declarado o bootstrap, além disso ao invés do BrowserModule esse módulo terá importado o CommonModule que também contém os pipes e diretivas comuns necessários à aplicação.
Criando um componente
No terminal digitamos: ng g c “nomedomodulo”
Quando criamos um componente, são criados os arquivos de html, css e ts e é atualizado o app.module, porém o componente criado deve ser declarado no módulo criado, e não no módulo principal.
Seguindo as boas práticas do Angular, o componente deve ser declarado no final dos imports já inseridos anteriormente.
Apesar do component não ser declarado no app.module, pois está declarado no novo modulo criado, esse novo módulo deve ser importado no app.module
Quando criamos um novo componente, dentro de um diretório, esse componente se torna um componente privado do diretório onde foi criado.
Exemplo: Ao criarmos um curso detalhes dentro do diretório cursos e o declararmos no curso.component.html, ele fica disponível para ser visualizado no browser.
Porém como não o exportamos no curso.module ele não ficará disponível em mais nenhum módulo. Se torna um componente privado:
