RxJS：配列を持つJSONデータ。ストリーム内の各項目をさらに処理します。

Question

HTTP応答を受け取ります。すべてがうまくいくと、JSONとしてコード化された単一の配列が含まれています。
この配列を取得し、いくつかの項目を除外し、渡す項目をイベントとして処理したいと考えています。私はこれまで何

は次のとおりです。

return this._http.get(url) 
     .map((res:Response) => res.json()) 
     .map((data:any) => { 
      if (!Array.isArray(data) || data.length == 0) { 
       throw new Error("No items returned, URL: " + url); 
      } 
      let projects = <ProjectModel[]>service.fromJSONarray(data, this._http); 
      return Observable.from(projects) 
       .filter((project: ProjectModel) => project.parentProject == null) 
       .subscribe(project -> ...) 
     }) 

私はネストを好きではありませんが。私はこれを行う方法があると仮定します：

return this._http.get(url) 
     .map((res:Response) => res.json()) 
     .map((data:any) => { 
      ... 
      let projects = <ProjectModel[]>service.fromJSONarray(data, this._http); 
      ??? 
     }) 
     .filter((project: ProjectModel) => project.parentProject == null) 
     .subscribe(project -> ...) 

どのように達成するには？

Answer 1

Observablesの配列にマッピングするときはいつでも、flatMapと思っているはずです。

return this._http.get(url) 
    .map((res:Response) => res.json()) 
    .flatMap((data:any) => { 
     if (!Array.isArray(data) || data.length == 0) { 
      throw new Error("No items returned, URL: " + url); 
     } 
     let projects = <ProjectModel[]>service.fromJSONarray(data, this._http); 
     return Observable.from(projects); 
    }) 
    .filter((project: ProjectModel) => project.parentProject == null) 
    //...etc 

あるいは、より単純

あなたはRxJS 5 concatAll()でも、簡単な方法とネストされた平坦化のためにその文書化されていない機能がありますを使用していると仮定すると、

Observable 
    .range(0, 2) 
    .flatMap(() => Observable.from([1, 2, 3])) 
    .filter((foo) => foo !== 1) 
    .subscribe((res) => console.log(res)); 

// 2 
// 2 
// 3 
// 3 

Answer 2

：ように見えるあなたの例では

、 concatAll()はHigher-Order Observablesで作業するようになっています。それはこの単純なことができProjectModelのちょうど単一のインスタンス

let data = '[{"id":1},{"id":2},{"id":3},{"id":4}]'; 

Observable.of(data) 
    .map(JSON.parse) 
    .concatAll() // each object is emitted separately 
    .map(p => p) // transform to ProjectModel 
    .filter(p => true) // filter whatever you want 
    .subscribe(v => console.log(v)); 

service.fromJSONarrayあれば復帰します。配列を返すためにservice.fromJSONarrayが必要な場合は、map(JSON.parse)とconcatAll()の間に配置します。コンソールにこのデモプリント：しかし

{ id: 1 } 
{ id: 2 } 
{ id: 3 } 
{ id: 4 } 

、それはあなたが欲しいかどうかに応じてconcatMap()またはflatMap()を使用する必要があるだろういくつかの余分なHTTPリクエストを行う必要があるので、あなたが他の観測を発するservice.fromJSONarrayから観測を返していた場合同じ商品の注文を維持するかどうかを指定します。

let data = '[{"id":1},{"id":2},{"id":3},{"id":4}]'; 

function fromJSONarray(arr) { 
    return Observable.from(arr) 
     .flatMap(p => Observable.of(p)); 
} 

Observable.of(data) 
    .map(d => fromJSONarray(JSON.parse(d))) 
    .concatAll() 
    .map(p => p) // transform to ProjectModel 
    .subscribe(v => console.log(v)); 

結果は同じです。

同様の質問：

• Subscribing to a nested Observable

• Merge subarrays using Observables

• RxJS Refactor nested map statement