javascript - Cum să legi mai multe apeluri .map() pe elementele anterioare folosind rxjs

În exemplul de mai jos mă întrebam cum ai proceda pentru a efectua două operații asupra aceluiași răspuns de la .switchMap().

În exemplu am pus al doilea .map care este clar greșit, dar într-un fel ilustrează ceea ce vreau să fac. Cum aș putea apela două funcții. De asemenea, când scot primul map() într-o funcție ca .map(response => {fn1; fn2;}); TypeScript aruncă o eroare?

@Effect()
    getUserCourse$: Observable<Action> = this.actions$
        .ofType(userCourse.ActionTypes.LOAD_USER_COURSE)
        .map<string>(action => action.payload)
        .switchMap(userCourseId => this.userCourseApi.getUserCourse(userCourseId))
        .map(response => new userCourse.LoadUserCourseSuccessAction(response.data));
        .map(response => new course.LoadCourseSuccessAction(response.course));

Răspuns #1

Pentru acest răspuns presupun că ambele funcții userCourse.LoadUserCourseSuccessAction și course.LoadCourseSuccessAction returnează Observables. Dacă nu, poți întotdeauna să creezi unul cu Rx.Observable.of sau Rx.Observable.fromPromise, în cazul, de exemplu, al unui apel AJAX.

Dacă te înțeleg corect, vrei să faci lucruri independente cu răspunsul, dar să le faci în paralel și să combini rezultatele înapoi în flux. Aruncă o privire peste următorul cod care arată cum poate fi realizat acest lucru.

Rx.Observable.of(
  {data: 'Some data', course: 'course1'},
  {data: 'Some more data', course: 'course2'}
).mergeMap((obj) => {
  // These two streams are examples for async streams that require
  // some time to complete. They can be replaced by an async AJAX 
  // call to the backend.
  const data$ = Rx.Observable.timer(1000).map(() => obj.data);
  const course$ = Rx.Observable.timer(2000).map(() => obj.course);

  // This Observable emits a value as soon as both other Observables
  // have their value which is in this example after 2 seconds.
  return Rx.Observable.combineLatest(data$, course$, (data, course) => {
    // Combine the data and add an additinal `merged` property for
    // demo purposes.
    return { data, course, merged: true };
  });
})
.subscribe(x => console.log(x));

Demonstrație executabilă