dynamics 365 - Angular merge/join/combine two subscribes

Question

I need to customize the Dynamics365 Event Portal home page, where I try to add Speakers (model) to each Event (model) in a list of Events. The list of Events is calling loadPublishedEvents() in the home.component.ts:

private loadPublishedEvents() {
    this.isLoading = true;       
    this.eventService.getPublishedEvents().subscribe(
        events => {
            this.allEvents = events;
            this.filteredEvents = events;
            this.isLoading = false;
        },
        (error: LocalizableError) => this.handleErrorResponse(error)
    );
}

Now for each Event, I want to add the Speakers of that Event. First I've extended the Events model by adding speakers: Speaker[];

There is also a page with the Event details, where the Speakers are displayed per Event. This detail page is calling loadSpeakers() form speakers.component.ts:

private loadSpeakers() {
    this.isLoading = true;
    this.eventService.getSpeakers(this.readableEventId).subscribe(
        speakers => {
            this.speakers = speakers;
            this.route.queryParamMap.subscribe(paramMap => {
                const selectedSpeakerId = paramMap.get(EventQueryParameterNames.SpeakerId);
                this.selectSpeakerById(selectedSpeakerId);
            });
            this.isLoading = false;
        },
        (error: LocalizableError) => this.handleErrorResponse(error)
    );
}

I there a way to combine these two?

I must say, I'm new to Angular and Google did not get me to the right answer so far (or I didn't implement it right, which is more likely...).

question from:https://stackoverflow.com/questions/65859246/angular-merge-join-combine-two-subscribes

Answer 1

You can use combineLatest of rxjs.

So, you can pass array of observables as parameter and get all results altogather.

Example:

combineLatest([firstMethod(), secondMethod()]).subscribe(
   results => {
      // accessing results
      const firstMethodsResult = results[0];
      const secondMethodsResult = results[1];
   }
);