What are Angular Modules

In Angular Modules are the one which combine the various units like components, service, directives etc into a full application. Every Angular application should have at least one Module called the root module which binds the units together and bootstraps the application. Larger applications can have additional modules for better modularity and maintainability.

Angular modules are classes decorated with the @NgModule decorator. The following are some of the important properties declared while creating an Angular Module.

declarations: All components, directives, and pipes used in the application should be listed here.

exports: List of declarations which are exposed to other modules from this module.

imports: List of declarations to be imported from other modules.

providers: List of services which should be accessable throughout the application, we can also declare the services at the component level instead of adding them here.

bootstrap: The main/root component which should be loaded when the application starts.

The most basic Angular module looks like this.

import { BrowserModule } from '@angular/platform-browser';

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

import { AppComponent } from './app.component';

@NgModule({

  declarations: [AppComponent],

  imports: [BrowserModule],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }

bootstrap is specified only in the root module, other modules are loaded from the root module hence they don’t need the bootstrap property. Also we import the BrowserModule only in the root module.