I have a fork join that grabs data from 10 http sources, and works well. The structure of each source is the same. However, the results i'm looking for are in the "data" property of the response. I need to get all the results into a single array of objects.

Response

{
 data:[stuff],
 included: [stuff],
 version: 1.0
}

Code

 forkJoin(requestArray).subscribe(results => {
   console.log(results);
 });

How can I return the result of this forkjoin, merging all of arrays from in the data property from every response into a single array?

Desired Output

[{all-Data-Objects-In-An-Array}, ...]

I have a fork join that grabs data from 10 http sources, and works well. The structure of each source is the same. However, the results i'm looking for are in the "data" property of the response. I need to get all the results into a single array of objects.

Response

{
 data:[stuff],
 included: [stuff],
 version: 1.0
}

Code

 forkJoin(requestArray).subscribe(results => {
   console.log(results);
 });

How can I return the result of this forkjoin, merging all of arrays from in the data property from every response into a single array?

Desired Output

[{all-Data-Objects-In-An-Array}, ...]

• javascript
• angular
• rxjs

2 Answers 2

import { Component } from "@angular/core";
import { Observable } from "rxjs/Observable";
import "rxjs/add/observable/timer";
import "rxjs/add/operator/do";
import "rxjs/add/operator/take";
import "rxjs/add/operator/share";
import "rxjs/add/operator/shareReplay";
import { forkJoin } from "rxjs/observable/forkJoin";
import { of } from "rxjs/observable/of";
import { tap, map } from "rxjs/operators";

@Component({
  selector: "my-app",
  templateUrl: "./app.ponent.html",
  styleUrls: ["./app.ponent.css"]
})
export class AppComponent {
  name = "Angular 5";
  data1 = {
    data: ["abc"],
    version: 1.0
  };
  data2 = {
    data: ["abc"],
    version: 1.0
  };
  private init$: Observable<any>;

  public ngOnInit() {
    forkJoin(of(this.data1), of(this.data2))
      .pipe(
        map(results => results.reduce((all, itm) => all.concat(itm.data), []))
      )
      .subscribe(results => {
        console.log(results);
      });
  }
}

just add a map operator and run a reduce inside it...

forkJoin(requestArray).pipe(
  map(results => results.reduce((all, itm) => all.concat(itm.data), []))
).subscribe(results => {
   console.log(results);
 });