AngularFireStore return collection with subquery

Question

I have the following function

getParticipations(
    meetingId: string
  ): Observable<Participation[]> {
    return this.meetingCollection
      .doc(meetingId)
      .collection<ParticipationDto>('participations')
      .snapshotChanges()
      .pipe(
        map(actions =>
          actions.map(m => {
            const participationDto = m.payload.doc.data() as ParticipationDto;
            const id = m.payload.doc.id;
            return new Participation(id, participationDto.vart, null);
          })
        )
      );
  }

In the participationDto there is a document reference and I would like to get that document in order to return an object (participation) with a mapping of the referenced document.

Something like

  getParticipations(
    meetingId: string
  ): Observable<Participation[]> {
    return this.meetingCollection
      .doc(meetingId)
      .collection<ParticipationDto>('participations')
      .snapshotChanges()
      .pipe(
        map(actions =>
          actions.map(m => {
            const participationDto = m.payload.doc.data() as ParticipationDto;
            const id = m.payload.doc.id;
            return this.participantCollection.doc(participationDto.participant.id).get().pipe(
              map(pp => {
                return new Participation(id, participationDto.vart, pp.data() as Participant);
              })
            );
          })
        )
      );
  }

But then it returns an Observable<Observable<Participation>[]> I probably need to merge, map or something like that but I don't find the right way to get my Observable enriched with my object mapping and keep my Observable<Participation[]>

Thanks for help

Answer 1

You could try using forkJoin on the inner list of Observables and switching the outer map to a switchMap.

     getParticipations(
    meetingId: string
  ): Observable<Participation[]> {
    return this.meetingCollection
      .doc(meetingId)
      .collection<ParticipationDto>('participations')
      .snapshotChanges()
      .pipe(
        switchMap(actions =>
          forkJoin(actions.map(m => {
            const participationDto = m.payload.doc.data() as ParticipationDto;
            const id = m.payload.doc.id;
            return this.participantCollection.doc(participationDto.participant.id).get().pipe(
              map(pp => {
                return new Participation(id, participationDto.vart, pp.data() as Participant);
              })
            ));
          })
        )
      );
  }