ConcatMap with a loop inside

Viewed 49

I have this code. I need it to run sequentially. I am getting most of my data except two requests. They are being run in a loop since I need these two calls to run for each account. The requests run but they return observables. I need to get the data from them. Not sure how to do this...

this.subscriptions.push(
  this.service1
    .subscribeToHouseholdId()
    .pipe(
      concatMap((householdId: number) => {
        return forkJoin([this.service2.getAccounts(householdId), this.service3.getTemplates()]);
      }),
      concatMap(([accountResponse, templates]) => {
        return observableOf(
          accountResponse?.results.map((account) => {
            return forkJoin([
              this.service3.getData1(account.id),
              this.service3.getData2(account.id)
            ]);
          })
        ).pipe(
          map((data) => {
            return [data, accountResponse, templates];
          })
        );
      })
    )
    .subscribe(([data$, accountResponse, templatesResponse]) => {
      const accountResults = accountResponse as IAccount;
      const templates = templatesResponse as ITemplate;

      const templatesData = this.filterTemplatesData(templates);

      accountResults?.results.forEach((account, index) => {
        const { instruction, brokerage } = data$[index];
        const tableData = instruction as IInstruction[];
        const bepData = brokerage as IPlan;
      });
        
    });
);

When I get to the forEach at the bottom 'instruction' and 'brokerage' should have data but they are just observables. How can I get the data from those observables without nested subscriptions?

0 Answers
Related