観測可能に戻る前にデータを操作する

Question

私はAngular 2とObservablesの概念でかなり新しいです。しかし、私が達成しようとしていることは経験豊かな指導者のためにかなり簡単でなければなりません:)

So： 私はsubscribedサービスから来ている観測可能なコンポーネントを持っています。テスト目的のために、私はデータ配列を使用してコンポーネントをライブ化しています。これが完了したら、実際のAPI呼び出しを私のサービスにフックしたい。今問題は、サーバーから取得したデータをコンポーネントに返す前に操作する必要があることです。私がそれを操作すると、nullのプロパティ 'subscribe'を読み取ることができないなどのエラーが発生します

私のサービスでは観測可能なので、HTTP.getメソッドを使用してコードリクエストを送信するので、その応答が終わるのを待つ。私はサーバーから結果を得るが、それはコンソールのエラーの後に来る。

サービスを購読しているコンポーネントに送信する前に、HTTPコールを要求してデータを操作する方法を教えてもらえますか？ここ

getSearchResults(keyword, parentId?, subCatId?) { 
    this.subscriptionResults = this.catalogService.getSearchResults(keyword, parentId, subCatId) 
     .subscribe(
      data => { 
       this.results      = data.results.parts; 
       this.numResults     = data.results.totalItemCount; 
       this.timeResults    = data.results.processingTimeMS; 
       this.categories     = data.categories; 
       this.subCategories   = data.subCategories; 
       this.brands       = data.brands; 
       this.suppliers     = data.suppliers; 
       this.layoutType     = data.layoutType; 
       this.allCategories   = data.allCategories; 
       this.selCategoryName  = data.selCategoryName; 
       this.selSubCategoryName = data.selSubCategoryName; 

       if (this.debugMode) { 
        console.log('RESULTS: ', data); 
       } 
      }, 
      error => this.errorMessage = <any>error 
     ); 
} 

そして、私のサービスである：私は私はそれを返すようにしたい前に、応答データを操作したい

// Get data from server 
getDataFromServer(URL: string): Observable<any> { 
    return this.http.get(URL).flatMap(this.extractData).catch(this.handleError); 
} 


getSearchResults(keyword: string, parentCatId?:number, subCatId?:number): Observable<any> { 

    let request = null; 
    let result = null; 

    let URL = this.API_URL + '/search?categoryId=' + subCatId + '&format=json'; 
    request = this.getDataFromServer(URL); 

    request.subscribe(
     () => { 
      // Modify result here and send it back 
     }, 
     error => { console.log('ERROR: ', <any>error); } 
    ); 

が

は、ここに私のコンポーネントのコードです。どうやってやるの？

- EDIT - 私はBehaviorSubjectを返す場合 ：

return new BehaviorSubject<any>(request.subscribe(
      res => { return this.processResultData(res, layoutType, keyword, parentCatId, subCatId); }, 
      err => { console.log('RETURN ERROR: ', <any>err); } 
     )); 

私は（私は必要いけない何かである）私のコンポーネントにサブスクリプションオブジェクトを取得します。代わりに、私はサブスクリプションの中にデータが必要です。

Answer 1

コンポーネントが戻り値をgetSearchResults()から購読しているため、関数はObservableを返す必要があります。 getDataFromServer()関数はobservableを返すので、その戻り値にはObservable.map()を使用します。 Observable.map（）は、観測可能なストリームを移動する値を変更し、変更された値の新しい観測値を返します。新しい観察可能な要素は、コンポーネントがサブスクライブしたい要素です。したがって、これを返す必要があります。

コードでは、それは次のようになります。あなたのコンポーネントが加入は、それが.map()から来て変更した応答が表示されるはずです

 
getSearchResults(keyword: string, parentCatId?:number, subCatId?:number): Observable { 

    let request = null; 
    let result = null; 

    let URL = this.API_URL + '/search?categoryId=' + subCatId + '&format=json'; 
    return this.getDataFromServer(URL).map(
     (response) => { 

      // Modify response here 

      // Return modified response 
     } 
    ).catch((error) => { console.log('ERROR: ', error); }); 
} 

。