How it works: Angular Modules
Jul 23, 2017 · 1 min read
Angular modules are containers for different parts of your app.
You can have nested modules, your app.module is already actually nesting other modules such as BrowserModule and you can add RouterModule and so on.
A module is a class with the @NgModule decorator
import { AppComponent } from './app.component';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
@NgModule({
bootstrap: [AppComponent]
declarations: [AppComponent],
exports: [],
imports: [BrowserModule],
providers: [],
})
export class AppModule { }To create a module we add @NgModule passing some parameters:
bootstrap: The component that will be the root of your application. This configuration is only present on your root moduledeclarations: Resources the module declares. When you add a new component you have to update the declarations (ng generate componentdoes it automatically)exports: Resources the module exports that can be used in other modulesimports: Resources the module uses from other modules (only module classes are accepted)providers: Resources that can be injected (di) in a component
A minimum App module is composed by:
AppComponent: The main component of your app (see Components)BrowserModule: The module required for your app to run in a browser
Angular How it works series
Check out other posts of this series, Angular How it works.
