共享 Angular 模块
共享特性模块
前提条件
对下列知识有基本的了解:
创建共享模块能让你更好地组织和梳理代码。你可以把常用的指令、管道和组件放进一个模块中,然后在应用中其它需要这些的地方导入该模块。
想象某个应用有下列模块:
content_copyimport { CommonModule } from '@angular/common';import { NgModule } from '@angular/core';import { FormsModule } from '@angular/forms';import { CustomerComponent } from './customer.component';import { NewItemDirective } from './new-item.directive';import { OrdersPipe } from './orders.pipe'; @NgModule{ imports: [ CommonModule ], declarations: [ CustomerComponent, NewItemDirective, OrdersPipe ], exports: [ CustomerComponent, NewItemDirective, OrdersPipe, CommonModule, FormsModule ]})export class SharedModule { }
请注意以下几点:
- 它导入了
CommonModule
,因为该模块需要一些常用指令。
通过重新导出 CommonModule
和 FormsModule
,任何导入了这个 SharedModule
的其它模块,就都可以访问来自 CommonModule
的 NgIf
和 NgFor
等指令了,也可以绑定到来自 FormsModule
中的 [(ngModel)]
的属性了。
即使 SharedModule
中声明的组件没有绑定过 [(ngModel)]
,而且SharedModule
也不需要导入 FormsModule
,SharedModule
仍然可以导出 FormsModule
,而不必把它列在 imports
中。 这种方式下,你可以让其它模块也能访问 FormsModule
,而不用直接在自己的 @NgModule
装饰器中导入它。
使用来自其它模块的组件和服务
在使用来自其它模块的组件和来自其它模块的服务时,有一个很重要的区别。 当你要使用指令、管道和组件时,导入那些模块就可以了。而导入带有服务的模块意味着你会拥有那个服务的一个新实例,这通常不会是你想要的结果(你通常会想取到现存的服务)。使用模块导入来控制服务的实例化。
获取共享服务的最常见方式是通过 Angular 的依赖注入系统,而不是模块系统(导入模块将导致创建新的服务实例,那不是典型的用法)。
要进一步了解共享服务,参见服务提供商。
关于 NgModule 的更多知识link
你可能还对下列内容感兴趣: