Angular 4 - Module
Module in Angular refers to a place where you can group the components, directives, pipes, and services, which are related to the application.In case you are developing a website, the header, footer, left, center and the right section become part of a module.
To define module, we can use the NgModule. When you create a new project using the Angular –cli command, the ngmodule is created in the app.module.ts file by default and it looks as follows −
import { BrowserModule } from '@angular/platform-browser';The NgModule needs to be imported as follows −
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
import { NgModule } from '@angular/core';The structure for the ngmodule is as shown below −
@NgModule({It starts with @NgModule and contains an object which has declarations, import s, providers and bootstrap.
declarations: [
AppComponent
],
imports: [
BrowserModule
],
providers: [],
bootstrap: [AppComponent]
})
Declaration
It is an array of components created. If any new component gets created, it will be imported first and the reference will be included in declarations as shown below −declarations: [
AppComponent,
NewCmpComponent
]
Import
It is an array of modules required to be used in the application. It can also be used by the components in the Declaration array. For example, right now in the @NgModule we see the Browser Module imported. In case your application needs forms, you can include the module as follows −import { FormsModule } from '@angular/forms';The import in the @NgModule will be like the following −
imports: [
BrowserModule,
FormsModule
]
No comments:
Post a Comment