RxJS - связывание нескольких наблюдаемых и выполнение других вещей между ними

Question

Я много смотрел в Интернете и не смог найти ничего, что описывает мою проблему.

Я сейчас использую Angular 5.

По сути, я хочу выполнить put http-запрос, затем, как только он завершится, сделать что-то, затем выполнить еще один get http-запрос и сделать еще кое-что.

Вот мой код с использованием вложенных подписок (что, я знаю, вам не следует делать):

this.projectService.updateProject(this.project).subscribe(
  subscribe => {
    doSomethingAfterTheUpdate();
    this.projectService.get(this.id).subscribe(
      subscribe => {
        doSomethingAfterTheGet();
        });
    });

Как видите, я обновляю проект, затем получаю проект. Как я могу сделать это правильно, используя RxJS. Я изучил методы Concat и MergeMap, но я хочу выполнить некоторые действия после обновления и получения.

Answer 1

Вы можете использовать операторы нажмите и switchMap для достижения этого:

import { switchMap, tap } from 'rxjs/operators';

// ...

this.projectService.updateProject(this.project)
  .pipe(
    tap(() => doSomethingAfterTheUpdate()),
    switchMap(() => this.projectService.get(this.id)),
    tap(() => doSomethingAfterTheGet())
  )
  .subscribe(results => console.log(results));

Надеюсь, это поможет!

Answer 2

Вы можете считать doSomethingAfterTheUpdate побочным эффектом, поэтому вы можете использовать следующее:

import { mergeMap, tap } from 'rxjs/operators';

this.projectService.updateProject(this.project).pipe(
   tap(_ => this.doSomethingAfterTheUpdate()),
   mergeMap(_ => this.projectService.get(this.id))
).subscribe(_ => this.doSomethingAfterTheGet());

Обратите внимание, что я использую _ в некоторых операциях с конвейером, поскольку вы действительно не используете значения в области.