NgModule

选项说明
providers

在当前模块的注入器中可用的一组可注入对象。

The set of injectable objects that are available in the injector of this module.

declarations

属于该模块的一组组件、指令和管道(统称可声明对象)。

The set of components, directives, and pipes (declarables) that belong to this module.

imports

这里列出的 NgModule 所导出的可声明对象可用在当前模块内的模板中。

The set of NgModules whose exported declarables are available to templates in this module.

exports

此 NgModule 中声明的一组组件、指令和管道可以在导入了本模块的模块下任何组件的模板中使用。 导出的这些可声明对象就是该模块的公共 API。

The set of components, directives, and pipes declared in this NgModule that can be used in the template of any component that is part of an NgModule that imports this NgModule. Exported declarations are the module's public API.

entryComponents

定义此 NgModule 中要编译的组件集,这样它们才可以动态加载到视图中。

The set of components to compile when this NgModule is defined, so that they can be dynamically loaded into the view.

bootstrap

当该模块引导时需要进行引导的组件。列在这里的所有组件都会自动添加到 entryComponents 中。

The set of components that are bootstrapped when this module is bootstrapped. The components listed here are automatically added to entryComponents.

schemas

该 NgModule 中允许使用的声明元素的 schema(HTML 架构)。 元素和属性(无论是 Angular 组件还是指令)都必须声明在 schema 中。

The set of schemas that declare elements to be allowed in the NgModule. Elements and properties that are neither Angular components nor directives must be declared in a schema.

id

当前 NgModule 在 getModuleFactory 中的名字或唯一标识符。 如果为 undefined,则该模块不会被注册进 getModuleFactory 中。

A name or path that uniquely identifies this NgModule in getModuleFactory. If left undefined, the NgModule is not registered with getModuleFactory.

jit

如果为 true,则该模块将会被 AOT 编译器忽略,因此始终会使用 JIT 编译。

If true, this module will be skipped by the AOT compiler and so will always be compiled using JIT.

选项

在当前模块的注入器中可用的一组可注入对象。

The set of injectable objects that are available in the injector of this module.

providers: Provider[]
      
      providers: Provider[]
    

在这里列出了提供商的依赖项可用于注入到任何组件、指令、管道或该注入器下的服务。 引导用的 NgModule 使用的是根注入器,可以为应用中的任何部件提供依赖。

Dependencies whose providers are listed here become available for injection into any component, directive, pipe or service that is a child of this injector. The NgModule used for bootstrapping uses the root injector, and can provide dependencies to any part of the app.

惰性加载的模块有自己的注入器,通常它是根注入器的一个子注入器。 惰性加载的服务,其作用范围局限于这个惰性加载模块的注入器。 如果惰性加载模块也提供了 UserService,则任何在该模块的上下文中创建的组件(比如通过路由导航)都会获得该服务的一个局部实例, 而不是根注入器中的全局实例。 而外部模块中的组件仍然会使用由它们的注入器提供的实例。

A lazy-loaded module has its own injector, typically a child of the app root injector. Lazy-loaded services are scoped to the lazy-loaded module's injector. If a lazy-loaded module also provides the UserService, any component created within that module's context (such as by router navigation) gets the local instance of the service, not the instance in the root injector. Components in external modules continue to receive the instance provided by their injectors.

范例

Example

下面的例子定义了一个类,它被注册在 HelloWorld 这个 NgModule 的注入器下:

The following example defines a class that is injected in the HelloWorld NgModule:

class Greeter { greet(name:string) { return 'Hello ' + name + '!'; } } @NgModule({ providers: [ Greeter ] }) class HelloWorld { greeter:Greeter; constructor(greeter:Greeter) { this.greeter = greeter; } }
      
      
  1. class Greeter {
  2. greet(name:string) {
  3. return 'Hello ' + name + '!';
  4. }
  5. }
  6.  
  7. @NgModule({
  8. providers: [
  9. Greeter
  10. ]
  11. })
  12. class HelloWorld {
  13. greeter:Greeter;
  14.  
  15. constructor(greeter:Greeter) {
  16. this.greeter = greeter;
  17. }
  18. }

属于该模块的一组组件、指令和管道(统称可声明对象)。

The set of components, directives, and pipes (declarables) that belong to this module.

declarations: Array<Type<any> | any[]>
      
      declarations: Array<Type<any> | any[]>
    

在模板中可用的选择器(selector)包括那些直接声明在这里的可声明对象和导入的那些 NgModule 中所导出的可声明对象。

The set of selectors that are available to a template include those declared here, and those that are exported from imported NgModules.

可声明对象必须属于也只能属于一个模块。 如果你尝试把同一个类声明在多个模块中,那么编译器就会报错。 要注意不能声明那些从其它模块中导入的类。

Declarables must belong to exactly one module. The compiler emits an error if you try to declare the same class in more than one module. Be careful not to declare a class that is imported from another module.

范例

Example

下面的例子允许 CommonModule 使用 NgFor 指令。

The following example allows the CommonModule to use the NgFor directive.

@NgModule({ declarations: [NgFor] }) class CommonModule { }
      
      @NgModule({
  declarations: [NgFor]
})
class CommonModule {
}
    

这里列出的 NgModule 所导出的可声明对象可用在当前模块内的模板中。

The set of NgModules whose exported declarables are available to templates in this module.

imports: Array<Type<any> | ModuleWithProviders<{}> | any[]>
      
      imports: Array<Type<any> | ModuleWithProviders<{}> | any[]>
    

模板可以使用来自任何导入模块中所导出的可声明对象,包括它们从别的模块导入后重新导出的。 例如,ModuleA 导入了 ModuleB 并导出了它,就会让 ModuleB 中的可声明对象也同样在那些导入了 ModuleA 的模块中可用。

A template can use exported declarables from any imported module, including those from modules that are imported indirectly and re-exported. For example, ModuleA imports ModuleB, and also exports it, which makes the declarables from ModuleB available wherever ModuleA is imported.

范例

Example

下列例子允许 MainModule 使用 CommonModule 中导入的任意可声明对象:

The following example allows MainModule to use anthing exported by CommonModule:

@NgModule({ imports: [CommonModule] }) class MainModule { }
      
      @NgModule({
  imports: [CommonModule]
})
class MainModule {
}
    

此 NgModule 中声明的一组组件、指令和管道可以在导入了本模块的模块下任何组件的模板中使用。 导出的这些可声明对象就是该模块的公共 API。

The set of components, directives, and pipes declared in this NgModule that can be used in the template of any component that is part of an NgModule that imports this NgModule. Exported declarations are the module's public API.

exports: Array<Type<any> | any[]>
      
      exports: Array<Type<any> | any[]>
    

可声明对象应该且只能属于一个 NgModule。 一个模块可以列出在它的 exports 中列出一些其它模块,这些模块中所有公开的可声明对象也同样会导出。

A declarable belongs to one and only one NgModule. A module can list another module among its exports, in which case all of that module's public declaration are exported.

默认情况下,可声明对象是私有的。 如果 ModuleA 不导出 UserComponent,那么只有这个 ModuleA 中的组件才能使用 UserComponent。

Declarations are private by default. If this ModuleA does not export UserComponent, then only the components within this ModuleA can use UserComponent.

导出具有传递性。ModuleA 可以导入 ModuleB 并将其导出,这会让所有 ModuleB 中的导出同样可用在导入了 ModuleA 的那些模块中。

ModuleA can import ModuleB and also export it, making exports from ModuleB available to an NgModule that imports ModuleA.

范例

Example

下面的例子导出了来自 CommonModuleNgFor 指令。

The following example exports the NgFor directive from CommonModule.

@NgModule({ exports: [NgFor] }) class CommonModule { }
      
      @NgModule({
  exports: [NgFor]
})
class CommonModule {
}
    

定义此 NgModule 中要编译的组件集,这样它们才可以动态加载到视图中。

The set of components to compile when this NgModule is defined, so that they can be dynamically loaded into the view.

entryComponents: Array<Type<any> | any[]>
      
      entryComponents: Array<Type<any> | any[]>
    

对于在这里列出的每个组件,Angular 都会为其创建一个 ComponentFactory,并将其保存到 ComponentFactoryResolver 中。

For each component listed here, Angular creates a ComponentFactory and stores it in the ComponentFactoryResolver.

Angular 会自动把模块的 bootstrap(引导模块)和路由定义中引用的组件添加到 entryComponents 列表中。 该选项用于添加那些需要写代码来创建的组件,比如 ViewContainerRef.createComponent()

Angular automatically adds components in the module's bootstrap and route definitions into the entryComponents list. Use this option to add components that are bootstrapped using one of the imperative techniques, such as ViewContainerRef.createComponent().

当该模块引导时需要进行引导的组件。列在这里的所有组件都会自动添加到 entryComponents 中。

The set of components that are bootstrapped when this module is bootstrapped. The components listed here are automatically added to entryComponents.

bootstrap: Array<Type<any> | any[]>
      
      bootstrap: Array<Type<any> | any[]>
    

该 NgModule 中允许使用的声明元素的 schema(HTML 架构)。 元素和属性(无论是 Angular 组件还是指令)都必须声明在 schema 中。

The set of schemas that declare elements to be allowed in the NgModule. Elements and properties that are neither Angular components nor directives must be declared in a schema.

schemas: Array<SchemaMetadata | any[]>
      
      schemas: Array<SchemaMetadata | any[]>
    

允许的取值包括 NO_ERRORS_SCHEMACUSTOM_ELEMENTS_SCHEMA

Allowed value are NO_ERRORS_SCHEMA and CUSTOM_ELEMENTS_SCHEMA.

当前 NgModule 在 getModuleFactory 中的名字或唯一标识符。 如果为 undefined,则该模块不会被注册进 getModuleFactory 中。

A name or path that uniquely identifies this NgModule in getModuleFactory. If left undefined, the NgModule is not registered with getModuleFactory.

id: string
      
      id: string
    

如果为 true,则该模块将会被 AOT 编译器忽略,因此始终会使用 JIT 编译。

If true, this module will be skipped by the AOT compiler and so will always be compiled using JIT.

jit: true
      
      jit: true
    

这是为了支持未来的 Ivy 渲染器,目前没什么用。

This exists to support future Ivy work and has no effect currently.