Multi providers 让我们可以使用相同的 Token 去注册多个 Provider ，具体如下：

constSOME_TOKEN:OpaqueToken=newOpaqueToken('SomeToken');varinjector=ReflectiveInjector.resolveAndCreate([provide(SOME_TOKEN,{useValue:'dependencyone',multi:true}),provide(SOME_TOKEN,{useValue:'dependencytwo',multi:true})]);//dependencies==['dependencyone','dependencytwo']vardependencies=injector.get(SOME_TOKEN);

上面例子中，我们使用 multi: true 告诉 Angular 2的依赖注入系统，我们设置的 provider 是 multi provider。正如之前所说，我们可以使用相同的 token 值，注册不同的 provide。当我们使用对应的 token 去获取依赖项时，我们获取的是已注册的依赖对象列表。

为什么 Angular 2 中会引入 multi provider ？

首先我们先来分析一下，若没有设置 multi: true 属性时，使用同一个 token 注册 provider 时，会出现什么问题 ？

classEngine{}classTurboEngine{}varinjector=ReflectiveInjector.resolveAndCreate([provide(Engine,{useClass:Engine}),provide(Engine,{useClass:TurboEngine})]);varengine=injector.get(Engine);//engineinstanceofTurboEngine==true

这说明如果使用同一个 token 注册 provider，后面注册的 provider 将会覆盖前面已注册的 provider。此外，Angular 2 使用 multi provider 的这种机制，为我们提供可插拔的钩子(pluggable hooks) 。另外需要注意的是，multi provider是不能和普通的 provider 混用。

Angular 2 框架中 multi provider 的应用

1.NG_VALIDATORS

该 Token 用于配置自定义验证器 Provider

@Directive({selector:'[customValidator][ngModel]',providers:[provide:NG_VALIDATORS,useValue:(formControl)=>{//validationhappenshere},multi:true]})classCustomValidator{}

以上是我们自定义的表单验证器，为了能够正常工作，我们必须在指令的 providers 数组中，使用 NG_VALIDATORS 注册相应的 provider。

2.APP_INITIALIZER

该 Token 用于配置系统初始化相关的 Provider

//exe-app-v2/src/core/core_module.tsexportfunctionconfigFactory(config:AppConfig){returnfunction(){config.load();}}@NgModule({...,providers:[//系统启动时，加载项目的配置文件，如系统登录、首页模块的ApiUrl等信息{provide:APP_INITIALIZER,useFactory:configFactory,deps:[AppConfig],multi:true}]})exportclassCoreModule{}

APP_INITIALIZER 详解

1.APP_INITIALIZER 的定义

//使用InjectionToken<T>的方式声明，APP_INITIALIZER关联的对象是数组，//数组内的元素是函数对象exportconstAPP_INITIALIZER=newInjectionToken<Array<()=>void>>('ApplicationInitializer');

2.注册 APP_INITIALIZER 关联的 Provider

//@angular/core/src/application_module.ts@NgModule({providers:[{provide:APP_INITIALIZER,useValue:_initViewEngine,multi:true},]})exportclassApplicationModule{}

3.APP_INITIALIZER 在系统中的应用

/***用于反映APP_INITIALIZER初始化函数的执行状态*/@Injectable()exportclassApplicationInitStatus{private_donePromise:Promise<any>;private_done=false;//标识是否完成初始化//在构造函数中注入APP_INITIALIZER，关联的依赖对象constructor(@Inject(APP_INITIALIZER)@Optional()appInits:(()=>any)[]){constasyncInitPromises:Promise<any>[]=[];if(appInits){//循环调用已注册的初始化函数for(leti=0;i<appInits.length;i++){constinitResult=appInits[i]();//验证初始化函数的调用结果是否为Promise对象，若是则添加至异步队列if(isPromise(initResult)){asyncInitPromises.push(initResult);}}}this._donePromise=Promise.all(asyncInitPromises).then(()=>{this._done=true;});if(asyncInitPromises.length===0){//不包含异步任务this._done=true;}}getdone():boolean{returnthis._done;}getdonePromise():Promise<any>{returnthis._donePromise;}}//启动ModuleFactorybootstrapModuleFactory<M>(moduleFactory:NgModuleFactory<M>):Promise<NgModuleRef<M>>{returnthis._bootstrapModuleFactoryWithZone(moduleFactory,null);}//在新创建的zone中，启动ModuleFactoryprivate_bootstrapModuleFactoryWithZone<M>(moduleFactory:NgModuleFactory<M>,ngZone:NgZone):Promise<NgModuleRef<M>>{return_callAndReportToErrorHandler(exceptionHandler,()=>{//获取ApplicationInitStatus关联的依赖对象constinitStatus:ApplicationInitStatus=moduleRef.injector.get(ApplicationInitStatus);//initStatus.donePromise=Promise.all(asyncInitPromises)//.then(()=>{this._done=true;});returninitStatus.donePromise.then(()=>{this._moduleDoBootstrap(moduleRef);returnmoduleRef;});});}

参考资料

multi-providers-in-angular-2