Angular 2 - Módulos

Módulos são usados ​​em Angular JS para colocar limites lógicos em seu aplicativo. Portanto, em vez de codificar tudo em um aplicativo, você pode construir tudo em módulos separados para separar a funcionalidade de seu aplicativo. Vamos inspecionar o código que é adicionado ao aplicativo de demonstração.

No código do Visual Studio, vá para a pasta app.module.ts na pasta do aplicativo. Isso é conhecido como a classe do módulo raiz.

O código a seguir estará presente no app.module.ts Arquivo.

import { NgModule }      from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser';  
import { AppComponent }  from './app.component';  

@NgModule ({ 
   imports:      [ BrowserModule ], 
   declarations: [ AppComponent ], 
   bootstrap:    [ AppComponent ] 
}) 
export class AppModule { }

Vamos examinar cada linha do código em detalhes.

  • A instrução import é usada para importar funcionalidades dos módulos existentes. Assim, as 3 primeiras instruções são usadas para importar os módulos NgModule, BrowserModule e AppComponent para este módulo.

  • O decorador NgModule é usado para definir posteriormente as importações, declarações e opções de bootstrapping.

  • O BrowserModule é exigido por padrão para qualquer aplicativo angular baseado na web.

  • A opção bootstrap diz ao Angular qual componente inicializar no aplicativo.

Um módulo é composto pelas seguintes partes -

  • Bootstrap array- Isso é usado para informar ao Angular JS quais componentes precisam ser carregados para que sua funcionalidade possa ser acessada no aplicativo. Depois de incluir o componente na matriz de bootstrap, você precisa declará-los para que possam ser usados ​​em outros componentes no aplicativo Angular JS.

  • Export array - Isso é usado para exportar componentes, diretivas e tubos que podem ser usados ​​em outros módulos.

  • Import array - Assim como o array de exportação, o array de importação pode ser usado para importar a funcionalidade de outros módulos Angular JS.