2016-12-08 12 views
0

私は「レポ」サービスに依存する「ストア」サービスを持っています。私のコンポーネントはサービスを使用します。 '店舗'サービスはちゃんと注入されているようですが、注入されるレポサービスはオブジェクトではなく機能のようです。私はそれがJSが実行される順序とは関係があると思うが、私はそれを理解することができなかった。角度2のDI注入機能はオブジェクトではなく

検索エンジンのメリット:「XXXは機能ではありません」というエラーメッセージが表示されます。注入されたレポの機能にアクセスしようとしたときにそれを取得します。ここで

はいくつかのコードです:

app.module:

import { ServiceCallListComponent } from './service-call-list/service-call-list.component'; 
import { AppComponent } from './app.component'; 
import { ServiceCallsDataRepository } from './data/service-call.repo' 
import { SERVICE_CALLS_DATA_REPO } from './data/service-call.repo.token' 
import { LocalServiceCallsDataRepository } from './data/service-call.repo.local'; 
import { ServiceCallsStore } from './data/serivce-call.store'; 

@NgModule({ 
    declarations: [ 
    AppComponent, 
    ServiceCallListComponent, 
    ], 
    imports: [... ], 
    bootstrap: [AppComponent], 
    providers: [{ provide: SERVICE_CALLS_DATA_REPO, useValue: LocalServiceCallsDataRepository }, 
    ServiceCallsStore, LocalServiceCallsDataRepository, 

    ], 
}) 
export class AppModule { } 

service-call.store

import { Injectable, Inject } from '@angular/core'; 
import { Observable, Observer, Subject, BehaviorSubject } from 'rxjs/rx'; 
import { ServiceCall } from './service-call.model' 
import { ServiceCallsDataRepository, StoreResultsRange } from './service-call.repo' 
import { SERVICE_CALLS_DATA_REPO } from './service-call.repo.token' 
import { LocalServiceCallsDataRepository } from './service-call.repo.local' 

@Injectable() 
export class ServiceCallsStore { 
    // repo: LocalServiceCallsDataRepository; 
    constructor(@Inject(SERVICE_CALLS_DATA_REPO) private repo: ServiceCallsDataRepository) { 
    //  constructor( private repo: LocalServiceCallsDataRepository) { 
     //constructor() { 
     //this.repo=new LocalServiceCallsDataRepository(); 
    } 

    public getSerivesCallsObservable(filter: BehaviorSubject<string>, range: Observable<StoreResultsRange>): Observable<Array<ServiceCall>> { 
     let b = this.repo.getServiceCalls2(); 
     let observable = filter.map(fltr => this.repo.getServiceCalls2().filter(sc => sc.name.indexOf(fltr) > -1)); 
     // range.subscribe(rng => this.repo.load(filter.getValue(), rng)) 
     return observable; 
    } 

    public add(serviceCall: ServiceCall): void { 
     this.repo.add(serviceCall); 
    } 
} 

サービスcall.repo

import { Injectable, Inject } from '@angular/core'; 
    import { Observable, Observer, Subject, BehaviorSubject } from 'rxjs/rx'; 
    import { ServiceCall } from './service-call.model' 
    import { ServiceCallsDataRepository, StoreResultsRange } from './service-call.repo' 
    import { SERVICE_CALLS_DATA_REPO } from './service-call.repo.token' 
    import { LocalServiceCallsDataRepository } from './service-call.repo.local' 

    @Injectable() 
    export class ServiceCallsStore { 
       constructor(@Inject(SERVICE_CALLS_DATA_REPO) private repo: ServiceCallsDataRepository) { 
     //  constructor( private repo: LocalServiceCallsDataRepository) { 
     } 

     public getSerivesCallsObservable(filter: BehaviorSubject<string>, range: Observable<StoreResultsRange>): Observable<Array<ServiceCall>> { 
      let b = this.repo.getServiceCalls2(); 
      let observable = filter.map(fltr => this.repo.getServiceCalls2().filter(sc => sc.name.indexOf(fltr) > -1)); 
      // range.subscribe(rng => this.repo.load(filter.getValue(), rng)) 
      return observable; 
     } 

     public add(serviceCall: ServiceCall): void { 
      this.repo.add(serviceCall); 
     } 
    } 

service- call.repo.local

import { Injectable, Inject } from '@angular/core'; 
import { Observable, Observer, Subject, BehaviorSubject } from 'rxjs/rx'; 
import { ServiceCall } from './service-call.model' 
import { ServiceCallsDataRepository,StoreResultsRange } from './service-call.repo' 

@Injectable() 
export class LocalServiceCallsDataRepository implements ServiceCallsDataRepository { 
    private data: Array<ServiceCall> = new Array<ServiceCall>(); 
    private serviceCalls = new BehaviorSubject<Array<ServiceCall>>(new Array<ServiceCall>()); 
    constructor() { 
    } 

    public getServiceCalls2(): Array<ServiceCall> { 
     return this.data;//this.serviceCalls.getValue(); 
    } 

    public add(serviceCall: ServiceCall): void { 
     throw "not implemented"; 
    } 

    public load(filter: string, range: StoreResultsRange): void { 
     throw "not implemented"; 

     //this.serviceCalls.next(this.data); 
    } 
} 

サービスcall.repo.token

import { OpaqueToken } from '@angular/core'; 

export let SERVICE_CALLS_DATA_REPO = new OpaqueToken('SERVICE_CALLS_DATA_REPO'); 
+0

あまり関係のないコードがあります。 'SERVICE_CALLS_DATA_REPO'サービスはクラスです。オブジェクトではありません。オブジェクトとして注入する場合は、 'useValue'を使用しないでください(また、ここでは' OpaqueToken'も必要ありません)。 – estus

答えて

2

useClassの代わりuseValueを使用してみてください。このように:

{ provide: SERVICE_CALLS_DATA_REPO, useValue: LocalServiceCallsDataRepository }

関連する問題