角2 angular2.dev.js：23925例外：エラー：未知（約束）：

Question

のプロバイダなし

構成ファイル（datService.configuration）を持つ角度サービス（DataService）をコンポーネントにロードしようとしています（ホーム）。私のホームコンポーネントで、DataServiceConfigurationをプロバイダリストに追加しないと、次のエラーが表示されます。

"DataServiceConfigurationのプロバイダがありません（Home - > DataService - > DataServiceConfiguration）"

dataService.ts：

import { Injectable } from 'angular2/core'; 
import { Http, Response, Headers, HTTP_PROVIDERS } from 'angular2/http'; 
import 'rxjs/add/operator/map' 
import { Observable } from 'rxjs/Observable'; 
import { DataServiceConfiguration } from './dataService.configuration'; 

@Injectable() 
export class DataService { 

    private actionUrl: string; 
    private headers: Headers; 

    constructor(private _http: Http, private configuration: DataServiceConfiguration) { 

     ... 
    } 

dataService.configuration.ts：

import { Injectable } from 'angular2/core'; 

@Injectable() 
export class DataServiceConfiguration { 
    public Server: string = "http://localhost/"; 
    public ApiPath: string = "api/v1/"; 
    public ApiUrl = this.Server + this.ApiPath; 

    constructor() { 
    } 
} 

Home.ts

import { DataService } from '../services/dataService'; 
import { DataServiceConfiguration } from '../services/dataService.configuration'; 

import { 
    Headers, 
    Http, 
    HTTP_BINDINGS, 
    Request, 
    RequestOptions, 
    RequestOptionsArgs, 
    HTTP_PROVIDERS 
} from 'angular2/http'; 

@ng.Component({ 
    selector: 'home', 
    templateUrl: './ng-app/components/public/home/home.html', 
    directives: [AlbumTile, ProdutoTile, Promocao, SuperOfertas, Banner, Categorias, DestaquesDaHome], 
    providers: [DataServiceConfiguration, DataService] 
}) 
export class Home implements ng.OnInit { 
    public lista: models.Lista; 
    public pagina: number = 1; 
    paginas: number = 1; 

    constructor(private http: Http, private _dataService: DataService) { 

    } 
} 

私は私のDataServiceはすでにそれをロードして、私のホームコンポーネントにDataServiceConfigurationを追加する必要がある理由私は理解していません。私のコンポーネントにDataServiceを追加するだけの方法はありますか？

Answer 1

ちょっと変わっていますが、コンポーネントだけが依存関係注入をAngularで設定できます（もちろん、bootstrap()でも基本的にはルートコンポーネントと同じです）。つまり、コンポーネントだけがプロバイダを指定できます。

コンポーネントにproviders配列が指定されている場合、コンポーネントツリーの各コンポーネントは、関連する「インジェクタ」を取得します。これはインジェクタツリーのように考えることができます。つまり、コンポーネントツリーよりも（通常はそれほど多くありません）分かりにくいです。依存関係を（コンポーネントORサービスによって）解決する必要がある場合、このインジェクタツリーが参照されます。依存関係を満たすことができる最初のインジェクタはそうする。インジェクタツリーは、ルートコンポーネント/インジェクタに向かって歩いています。

サービスで構成オブジェクトの依存関係を挿入するには、まずその構成オブジェクトをインジェクタに登録する必要があります。すなわち、構成要素のprovidersアレイ内にある。この登録は、サービスを使用/注入するコンポーネントのどこかで行う必要があります。

サービスは、登録された設定オブジェクトを注入することができます。登録された設定オブジェクトは、インジェクタツリーで見つかるためです。

Angular 2 - Including a provider in a serviceも参照してください。