Ожидание первого звонка (подписки) в ngOnInit ()

Question

Мне нужно дождаться первого звонка, прежде чем начинать второй запрос. Я новичок в JS, поэтому я думаю, что это может быть просто. Я читал что-то об async / await, но я не знаю, как реализовать это в этом примере

ngOnInit() {
  this.firstService.get$(this.orderNumber).subscribe(
      first => this.firstModel = first,
      e => {
        for (const error of e.errors) {
          this.messages.push({
            _type: MessageType.ERROR,
            code: error.messageCode
          });
        }
      }
  );
  this.secondService.getReasons$(this.firstModel).subscribe(
      second => this.secondModel = second,
      e => {
        for (const error of e.errors) {
          this.messages.push({
            _type: MessageType.ERROR,
            code: error.messageCode
          });
        }
      }
  );
}

this.firstModel не определено на втором шаге.

Answer 1

Вы должны использовать оператор switchMap() rxjs, который поможет вам получить первый ответ, а затем нацелиться на второй запрос. И вы можете отменить запрос, если вам не нужно.

Приведенные ниже коды разделены на множество частей, чтобы их было легко понять. Если хотите, вы можете объединить все.

    // Define both requests
    const firstReq = this.firstService.get$(this.orderNumber)
    const secondReq = this.secondService.getReasons$(this.firstModel);

    // combined has both response
    const combined= firstReq.pipe(switchMap(firstData =>{
        return secondReq ;
    }))

    combined.subscribe()

Для удобства вы можете использовать оператор tap, чтобы проверить оба ответа

const combined= firstReq.pipe(switchMap(firstData =>{
        return secondReq.pipe(tap(secondData =>{
            console.log('First request data',firstData);
            console.log('Second request data',secondData);
        }))
    }))

combined.subscribe()