- Angular7 教程
- Angular7 - 主页
- Angular7 - 概述
- Angular7 - 环境设置
- Angular7 - 项目设置
- Angular7 - 组件
- Angular7 - 模块
- Angular7 - 数据绑定
- Angular7 - 事件绑定
- Angular7 - 模板
- Angular7 - 指令
- Angular7 - 管道
- Angular7 - 路由
- Angular7 - 服务
- Angular7 - Http 客户端
- Angular7 - CLI 提示
- Angular7 - 表单
- 材料/CDK-虚拟滚动
- Angular7 - 材质/CDK - 拖放
- Angular7 - 动画
- Angular7 - 材料
- 测试和构建 Angular7 项目
- Angular7 有用资源
- Angular7 - 快速指南
- Angular7 - 有用的资源
- Angular7 - 讨论
Angular7 - 模块
Angular 中的模块是指可以对与应用程序相关的组件、指令、管道和服务进行分组的地方。
如果您正在开发一个网站,页眉、页脚、左侧、中心和右侧部分将成为模块的一部分。
为了定义模块,我们可以使用 NgModule。当您使用 Angular –cli 命令创建新项目时,默认情况下会在app.module.ts文件中创建 ngmodule,如下所示 -
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; import { NewCmpComponent } from './new-cmp/new-cmp.component'; @NgModule({ declarations: [ AppComponent, NewCmpComponent ], imports: [ BrowserModule, AppRoutingModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }
NgModule 需要按如下方式导入 -
import { NgModule } from '@angular/core';
ngmodule 的结构如下所示 -
@NgModule({ declarations: [ AppComponent, NewCmpComponent ], imports: [ BrowserModule, AppRoutingModule ], providers: [], bootstrap: [AppComponent] })
它以@NgModule开头,包含一个具有声明、导入、提供程序和引导程序的对象。
宣言
它是创建的组件数组。如果创建任何新组件,它将首先被导入,并且引用将包含在声明中,如下所示 -
declarations: [ AppComponent, NewCmpComponent ]
进口
它是应用程序中需要使用的模块数组。它也可以被声明数组中的组件使用。例如,现在在 @NgModule 中,我们看到导入的浏览器模块。如果您的应用程序需要表单,您可以使用以下代码包含该模块 -
import { FormsModule } from '@angular/forms';
@NgModule中的导入将如下所示 -
imports: [ BrowserModule, FormsModule ]
供应商
这将包括创建的服务。
引导程序
这包括用于启动执行的主应用程序组件。