Módulos em Angular

Módulos em Angular são containers que agrupam componentes, diretivas, pipes, serviços e outros módulos relacionados. Servem para manter a organização do projeto, gerenciar dependências entre componentes ou configurar roteamento. Podemos dividir a aplicações entre módulos que possui componentes que se relacionam, por exemplo, um módulo User que vai conter o service de user, os componentes de user, modelo de user, etc. em uma aplicação de corporativa, podemos ter os módulos de loja, financeiro, contábil.

Criando um módulo

ng generate module MeuModulo

Entendendo o Module

Com o surgimento da versão 17 do Angular, módulos passaram a ser opcionais, isso porque por padrão agora os componentes são standalone o que reduz a necessidade de utilizar módulos em um projeto. Agora, até o appModule que seria o módulo principal do projeto não existe mais, no lugar dele agora existe um arquivo app.confing.ts que vai conter um campo providers onde serão incluídos algumas configurações do projeto como declaração das rotas ou permitir o uso do httpClient na aplicação ou demais coisas.

import { ApplicationConfig } from '@angular/core';

export const appConfig: ApplicationConfig = {
  providers: [],
};

Apesar disso, projetos em versões mais antigas do Angular continuaram usando módulos, então continua sendo um conhecimento de válido e importante de se ter.

Um módulo precisa ser decorado com o decorator @NgModule ele também vai conter informações importantes para seu funcionamento que serão ainda abordados, um módulo simples seria assim:

import { NgModule } from ‘@angular/core’;
import { MeuComponente } from ‘./meu-componente.component’;

@NgModule({
declarations: [MeuComponente],
imports: [], // Outros módulos que este módulo depende
providers: [], // Serviços fornecidos por este módulo
})
export class MeuModulo { }

Um módulo precisa incluir suas declarações, importações e provedores.

Declarations

A propriedade declarations lista os componentes, diretivas e pipes que pertencem a este módulo. É onde você declara os recursos específicos que este módulo contém.

Imports

A propriedade imports é usada para importar outros módulos que são necessários para este módulo. Isso permite a criação de dependências claras entre diferentes partes da aplicação.

Providers

A propriedade providers lista os serviços que este módulo fornece. Os serviços são objetos compartilhados entre diferentes partes da aplicação.

Exports

A propriedade exports não é obrigatória, é usado para declarar quais componentes ou artefatos poderão ser usados por outros módulos que importarão esse módulo.

Usando um módulo em outro módulo

Como dito, para que seja possível usar componentes, serviços, diretivas, criadas e declaradas em um módulo, precisamos usar o exports na declaração do módulo e informar quais artefatos serão de uso para outros módulos. Depois de feito isso, basta incluir o módulo que deseja usar nos imports do outro módulo, assim, será possível usar todas as funcionalidades exportadas daquele módulo.