CODEWITHSUNDEEP
angularrxjspipefork-join
Kartheek Sarabu
Kartheek Sarabu

Reputation: 3926

RxJS forkjoin observables not retrieving

I need to fetch 3 APIs data and then I need to merge Subsidary with company and then to main to frame a final object.

I have written below http request in my service file.

getStaticContent$(): Observable<{
    mainStaticContent$: ObjectList;
    companyStaticContent$: ObjectList;
    subsidaryStaticContent$: ObjectList;
  }> {
    const mainStaticContent$: Observable<ObjectList> = this.http.get<ObjectList>(
      this.apiService.mainURL
    );
    const companyStaticContent$ = this.http.get<ObjectList>(
      this.apiService.companyURL
    );
    const subsidaryStaticContent$ = this.http.get<ObjectList>(
      this.apiService.subsiderayURL
    );

    return forkJoin({
      mainStaticContent$,
      companyStaticContent$,
      subsidaryStaticContent$,
    });
  }

I was unable to get this data in Angular resolver service where I need to perform some logic in it and then return final ObjectList. Please see my below code and give suggestions. I am new to rxJS and unable to resolve this issue

export class DataResolverService implements Resolve<ObjectList> {
  constructor(private dataService: DataService) {}

  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot
  ):
    | ObjectList
    | import('rxjs').Observable<ObjectList>
    | Promise<ObjectList> {
      

    return this.dataService.getStaticContent$().pipe(
      tap(
        ([
          mainStaticContent: any,
          companyStaticContent,
          subsidaryStaticContent,
        ]) => {
          // perform merge opration
          // then return ObjectList
          return objectList;
        }
      )
    );
  }
}

Upvotes: 0

Views: 279

Answers (1)

Mrk Sef
Mrk Sef

Reputation: 8062

  • If you send forkJoin an object, then you get an object in return. Not an array. You get this right in your method signature but not in your usage

  • Tap returns the same stream that it receives. The function you pass tap is expected to have a return type of void, so any return is ignored.

    return this.dataService.getStaticContent$().pipe(
      tap(
        ({ // <- Object not array
          mainStaticContent$,
          companyStaticContent$,
          subsidaryStaticContent$,
        }) => {
          // perform merge opration
          // then return ObjectList
          return objectList; // <- Tap ignores this
        }
      )
    );

Upvotes: 1

Related Questions