NgModules
前提条件
Prerequisites
对下列概念有基本的理解：
A basic understanding of the following concepts:
NgModules 用于配置注入器和编译器，并帮你把那些相关的东西组织在一起。
NgModules configure the injector and the compiler and help organize related things together.
NgModule 是一个带有 @NgModule 装饰器的类。 @NgModule 的参数是一个元数据对象，用于描述如何编译组件的模板，以及如何在运行时创建注入器。 它会标出该模块自己的组件、指令和管道，通过 exports 属性公开其中的一部分，以便外部组件使用它们。 NgModule 还能把一些服务提供商添加到应用的依赖注入器中。
An NgModule is a class marked by the @NgModule decorator. @NgModule takes a metadata object that describes how to compile a component's template and how to create an injector at runtime. It identifies the module's own components, directives, and pipes, making some of them public, through the exports property, so that external components can use them. @NgModule can also add service providers to the application dependency injectors.
要想找一个涉及本章所讲的全部技术的范例，参见
For an example app showcasing all the techniques that NgModules related pages cover, see the
Angular 模块化
Angular modularity
模块是组织应用和使用外部库扩展应用的最佳途径。
Modules are a great way to organize an application and extend it with capabilities from external libraries.
Angular 自己的库都是 NgModule，比如 FormsModule、HttpClientModule 和 RouterModule。 很多第三方库也是 NgModule，比如 Material Design、 Ionic 和 AngularFire2。
Angular libraries are NgModules, such as FormsModule, HttpClientModule, and RouterModule. Many third-party libraries are available as NgModules such as Material Design, Ionic, and AngularFire2.
NgModule 把组件、指令和管道打包成内聚的功能块，每个模块聚焦于一个特性区域、业务领域、工作流或通用工具。
NgModules consolidate components, directives, and pipes into cohesive blocks of functionality, each focused on a feature area, application business domain, workflow, or common collection of utilities.
模块还可以把服务加到应用中。 这些服务可能是内部开发的（比如你自己写的），或者来自外部的（比如 Angular 的路由和 HTTP 客户端）。
Modules can also add services to the application. Such services might be internally developed, like something you'd develop yourself or come from outside sources, such as the Angular router and HTTP client.
模块可以在应用启动时急性加载，也可以由路由器进行异步的惰性加载。
Modules can be loaded eagerly when the application starts or lazy loaded asynchronously by the router.
NgModule 的元数据会做这些：
NgModule metadata does the following:
声明某些组件、指令和管道属于这个模块。
Declares which components, directives, and pipes belong to the module.
公开其中的部分组件、指令和管道，以便其它模块中的组件模板中可以使用它们。
Makes some of those components, directives, and pipes public so that other module's component templates can use them.
导入其它带有组件、指令和管道的模块，这些模块中的元件都是本模块所需的。
Imports other modules with the components, directives, and pipes that components in the current module need.
提供一些供应用中的其它组件使用的服务。
Provides services that the other application components can use.
每个 Angular 应用都至少有一个模块，也就是根模块。 你可以引导那个模块，以启动该应用。
Every Angular app has at least one module, the root module. You bootstrap that module to launch the application.
对于那些只有少量组件的简单应用，根模块就是你所需的一切。 随着应用的成长，你要把这个根模块重构成一些特性模块，它们代表一组密切相关的功能集。 然后你再把这些模块导入到根模块中。
The root module is all you need in a simple application with a few components. As the app grows, you refactor the root module into feature modules that represent collections of related functionality. You then import these modules into the root module.
基本的模块
The basic NgModule
Angular CLI 在创建新应用时会生成下列基本的应用模块。
The Angular CLI generates the following basic app module when creating a new app.
// imports
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { ItemDirective } from './item.directive';
// @NgModule decorator with its metadata
@NgModule({
declarations: [
AppComponent,
ItemDirective
],
imports: [
BrowserModule,
FormsModule,
HttpClientModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
文件的顶部是一些导入语句。接下来是你配置 NgModule 的地方，用于规定哪些组件和指令属于它（declarations），以及它使用了哪些其它模块（imports）。 本章是基于引导一章的，那里详细讲了 NgModule 的结构。如果要进一步了解 @NgModule 的结构，参见引导。
At the top are the import statements. The next section is where you configure the @NgModule by stating what components and directives belong to it (declarations) as well as which other modules it uses (imports). This page builds on Bootstrapping, which covers the structure of an NgModule in detail. If you need more information on the structure of an @NgModule, be sure to read Bootstrapping.
关于 NgModule 的更多知识
More on NgModules
你可能还对下列内容感兴趣：
You may also be interested in the following:
