Angular2如何将所有接口实现注入服务列表?

Raf*_*łek 6 dependency-injection typescript angular

我正在用Typescript学习Angular2,我遇到了问题.

我有两个classe,imprements相同的界面.如何将它们作为列表注入服务?

我读到关于opaquetoken的问题https://angular.io/docs/ts/latest/guide/dependency-injection.html#opaquetoken

但我不知道我是否需要使用它以及如何使用它.

export interface CheckerInterface {
    check(text : string) : boolean
}

export class Checker1 implements CheckerInterface {
    check(text : string) : boolean {
    //do something 
    return true;
}

export class Checker2 implements CheckerInterface {
    check(text : string) : boolean {
    //do something 
    return true;
}

@Injectable()
export class Service {

  constructor(private checkers: CheckerInterface[]) {  //??
      checkers.foreach( checker => checker.check(somestring));
  }

}
Run Code Online (Sandbox Code Playgroud)

谢谢你的帮助 !

Pau*_*tha 6

您需要将数组添加为提供程序,或者multi: trueprovider配置中使用。

export const CHECKERS = new OpaqueToken('one');

@NgModule({
  providers: [
     { provide: CHECKERS, useValue: [new Checker1(), new Checker2()] },
  ]
})
Run Code Online (Sandbox Code Playgroud)

或者

@NgModule({
  providers: [
     { provide: CHECKERS, useClass: Checker1, multi: true },
     { provide: CHECKERS, useClass: Checker2, multi: true },
  ]
})
Run Code Online (Sandbox Code Playgroud)

第二种可能更可取,因为您让 Angular 创建它们,允许它们在需要时注入自己的依赖项。

CHECKERS然后注入的时候只需要使用token就可以了

import { Inject } from '@angular/core';
import { CHECKERS } from './wherever';

constructor(@Inject(CHECKERS) private checkers: CheckerInterface[]) { 
Run Code Online (Sandbox Code Playgroud)

更新

从 Angular 4 开始,InjectionToken使用OpaqueToken

export const CHECKERS = new InjectionToken<CheckerInterface>('CheckerInterface');
Run Code Online (Sandbox Code Playgroud)