在返回可观察值之前处理数据

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()修改的响应。