Как выполнить одно действие asyn c за другим без встроенных подписок

Question

Я хотел бы выполнять асин c действия одно за другим, используя rx js. Я знаю, что встраивание подписки в подписку не является хорошей практикой, и есть некоторые другие операторы rx js ( flatMap \ mergeMap, выполните et c. Используя pipe ).

Мне нужно получить параметры запроса компонента, установить глобальную переменную (globalVar) и только тогда , продолжить следующее асинхронное действие c (this..doSomething ()). Это мой код с использованием встроенных подписок: * doSomething возвращает наблюдаемое

this.route.paramMap.subscribe(params => 
    { 
      globalVar = + params['userId']; 
      this.<someService>.doSomething().subscribe(result => 
      {
        this.func1();
      });
    }

Answer 1

Идеальным решением для случаев, когда вы хотите объединить несколько наблюдаемых, является оператор switchMap.

this.route.paramMap
    .pipe(
      switchMap(params) => {
      globalVar = + params['userId']; 
      return this.<someService>.doSomething()
    })
    .subscribe(result=> {this.func1();})

То, что сделает switchMap, это то, что после получения параметров от this.route он вернет новую наблюдаемую, на которую вы можете позднее подписаться. Преимущество использования switchMap в этом случае состоит в том, что если в this.route.paramMap во время обработки this.<someService>.doSomething() есть изменения, rx js завершит обработку обрабатываемого запроса и запустит новый, сделав так дата в результат внутри subscribe всегда будет иметь отношение к текущему значению paramMap.

Answer 2

this.route.paramMap.pipe(
  switchMap(params => {
    globalVar = + params['userId'];
    return this.<someService>.doSomething().pipe(
      tap(() => this.func1())
    )
  })
).subscribe();

Answer 3

Async / await - это способ сделать ваш код читаемым так, чтобы его можно было читать последовательно. Это мой предпочтительный маршрут после того, как я также попытался внедрить наблюдаемое на нескольких уровнях.