共有サービスは、コンポーネント2にもインポートする必要がありますか？

Question

私はAngular 2アプリ全体で利用可能な設定が必要です。サービスを介してこれらの値を提供し、サービスがbootstrap()メソッドに組み込まれていることを保証することが、これを処理する最善の方法を理解しています。

だから私のサービスは、（init.service.ts）このようなものです：

import {Injectable} from 'angular2/core'; 

@Injectable() 
export class InitService { 
    public static startNodeIdContent:number = 1053; 
    public static startNodeIdMedia:number = 9999; 
} 

その後、私のブートストラップ法は、このようなものです：今

import {bootstrap}   from 'angular2/platform/browser' 
import {ROUTER_PROVIDERS} from 'angular2/router'; 
import {AppComponent}  from './app.component' 
import {RouteNames}   from './services/route-names.service'; 
import {InitService}  from './services/init.service'; 

bootstrap(AppComponent, [ROUTER_PROVIDERS,RouteNames,InitService]); 

、私は、コンポーネントにstartNodeIdContent値を利用できるようにする必要がありますこのように：

import { Component }     from 'angular2/core'; 
import { HTTP_PROVIDERS }    from 'angular2/http'; 
import { provide }      from 'angular2/core'; 
import { Router }      from 'angular2/router'; 
import { XHRBackend }     from 'angular2/http'; 

import { RouteNames }     from '../services/route-names.service'; 
import { ContentNode }     from './content-node'; 
import { ContentService }    from './content.service'; 
import { ContentTreeComponent }   from './content-tree.component'; 
import { ContentDashboardComponent } from './content-dashboard.component'; 

@Component({ 
    selector: 'my-dashboard', 
    template: ` 
     <div class="tree-panel-container"> 
      <div class="tree-panel-content"> 
       <content-tree [startNodeId]="startNodeIdContent"></content-tree> 
      </div> 
     </div> 
     <content-dashboard></content-dashboard> 
    `, 
    directives: [ContentTreeComponent, ContentDashboardComponent], 
    providers: [ 
     HTTP_PROVIDERS, 
     ContentService 
    ] 
}) 

export class ContentComponent { 
    constructor(private _routeNames:RouteNames, InitService){ 
     _routeNames.name.next('Content'); 
    } 
    startNodeIdContent = InitService.startNodeIdContent; 
} 

コンポーネントInitServiceが認識されません。まだそれを消費する各コンポーネントにInitServiceサービスをインポートする必要がありますか？私の中にはBootstrapメソッドにそれを注入すればいいと思っていますが、これがどのくらい正確に機能するかはドキュメントから分かりません。

ありがとうございました。

Answer 1

タイプ名は、インポートを使用して宣言されたファイルに直接接続されていない限り、単なる意味のない文字列です。アプリケーションには、同じ名前のクラスを無制限に含むことができます。輸入はどのタイプのクラスが参照するのかを明確にします。

インポートと提供/注入は、ほとんど関係のない概念です。

インポートは、現在のソースファイルに既知の型を知らせるためのもので、TypeScriptの概念です。これはオートコンプリート、linting、...のために必要です。 角度DIは、プロバイダをルックアップするためのキーとしてコンストラクタパラメータの型を使用します。型がインポートによって正規化されていない場合、Angulars DIはそれをキーとして使用できません。

ProvidingはAngulars DIの概念であり、プロバイダのスコープを定義します。 DIは、キー（型）と一致するプロバイダのインジェクタの階層ツリーを上に向かって検索し、そこからインスタンスを返します。

あなたが

constructor(@Inject('InitService') initService) { 
    // no auto-completion or type checking because of missing type information 
} 

のようにそれを注入するタイプ

bootstrap(AppComponent, provide('InitService', {useClass: InitService}); 

の代わりに文字列キーまたはOpaqueTokenを使用することができますが、型注釈のいくつかの利点に欠場と思います。