Angular JS中使用模块在您的应用程序中设置逻辑边界.因此,您可以将所有内容构建到单独的模块中,以分离应用程序的功能,而不是将所有内容编码到一个应用程序中.让我们检查一下添加到演示应用程序的代码.
在Visual Studio代码中,转到app文件夹中的app.module.ts文件夹.这被称为根模块类.
以下代码将出现在 app.module.ts 文件中.
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 { }
让我们详细介绍代码的每一行.
import语句用于从现有模块导入功能.因此,前3个语句用于将NgModule,BrowserModule和AppComponent模块导入到该模块中.
NgModule装饰器用于稍后定义导入,声明和自举选项.
默认情况下,任何基于Web的角度应用程序都需要BrowserModule.
bootstrap选项告诉Angular在应用程序中引导哪个Component.
模块由以下组成part :
Bootstrap数组 : 这用于告诉Angular JS需要加载哪些组件,以便可以在应用程序中访问其功能.一旦将组件包含在引导程序数组中,就需要声明它们,以便它们可以在Angular JS应用程序中的其他组件中使用.
导出数组 : 这用于导出组件,指令和管道,然后可以在其他模块中使用.
导入数组 : 就像导出数组一样,导入数组可用于从其他Angular JS模块导入功能.