Angular2タイプスクリプトグローバルプロバイダで解決するインターフェイス

Question

私のangular2アプリには、WebStorageServiceとMobileStorageServiceという2つのサービスがあり、インターフェイスIStorageServiceを実装しています。私のmain.componentで、私はWebStorageServiceでアプリをブートストラップし、私は以下のようにコンストラクタでプロバイダを取得しようとしていますコンポーネントの1、

// main.component 
bootstrap(AppComponent,[WebStorageService]) // WebStorageService implements IStorageService interface 

//AppComponent 
import {IStorageService} from "./IStorageService" 

@Component 
export class AppComponent { 

    constructor(private _storage: IStorageService) { } <-- throws an error Can't resolve all parameters for AppComponent 

} 

にそう、とのインターフェイスを使用してサービスを提供するために、どのような方法がありますタイプ？

Answer 1

@rinukusuの回答とともに、angular2の不透明なトークンが使用されました。

// main.component 
bootstrap(AppComponent,[{provide: globalStorageService, {useClass: WebStorage} }]) 

// where globalStorageService is an opaque token 
export let globalStorageService = new Token("IStorageService"); 

//AppComponent 
@Component 
export class AppComponent { 

    constructor(@Inject(globalStorageService) _storage:IStorageService){} 

} 

Answer 2

は、コンポーネントにプロバイダを追加します。

@Component({ 
    providers: [IStorageService]}) 
    export class AppComponent { 

     constructor(private _storage: IStorageService) { } 

    } 

Answer 3

あなたはDIのためのインタフェースを使用することはできません。コンパイルによってインタフェース情報が削除されるため、実行時には使用できません。インタフェースは静的解析専用です。