在返回可觀察值之前處理數據

Question

我對Angular 2和Observable概念非常新穎。然而，我試圖實現應該是相當簡單的經驗大師:)

因此： 我有一個組件，其中我有subscribed來自服務的observable。出於測試目的，我一直在使用數據陣列來生成我的組件。現在，當它完成後，我想將真正的API調用掛接到我的服務。現在問題是我從服務器獲得的數據在返回到組件之前需要被處理。當我操縱它，我得到錯誤，如「無法讀取屬性'訂閱零」

現在基本上這個錯誤來了，因爲在我的服務observable，我發送一個API請求使用HTTP.get方法和代碼doesn等待它的迴應完成。我確實從服務器得到了結果，但是在控制檯出現錯誤之後。

任何人都可以請指導我如何請求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); } 
    ); 

我要處理的響應數據之前，我想退貨。我怎樣才能做到這一點？

- 編輯 - 如果我返回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.map()。 Observable.map（）允許您修改移動通過可觀察流的值，並返回修改後的值的新可觀察值。這個新的observable是你的組件想要訂閱的那個，所以這是應該返回的。

在代碼中，它看起來像：

 
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); }); 
} 

當你的組件訂閱，也應該看到，來自.map()修改的響應。