Как я могу вызвать несколько запросов на событие ввода ключа пользователя?

Question

Я пытаюсь вызвать 2 http запроса на событие ввода ключа в текстовое поле.

ngAfterViewInit() {
fromEvent(this.input.nativeElement, 'keyup')
return forkJoin(
  this.playerService
  .findPlayers(1, 'userName', this.input.nativeElement.value, 'asc', 0, 20),
  this.messagesService.getConversations()
)
.pipe(
  map(([first, second]) => {
    return { first, second };
  })
)
.subscribe({first, second} => this.players = first.players, this.conversations = second);
}

Это то, что правильно работает с одним запросом:

ngAfterViewInit() {
fromEvent(this.input.nativeElement, 'keyup')
.pipe(
  startWith({}),
  switchMap(() => {
    return this.playerService
    .findPlayers(1, 'userName', this.input.nativeElement.value, 'asc', 0, 20)
    .map(data => {
      return data.players;
    });
})).subscribe(players => this.players = players);
}

Answer 1

Обновите ваш код следующим образом:

ngAfterViewInit() {
    fromEvent(this.input.nativeElement, 'keyup')    
    .pipe(
      switchMap(() => forkJoin(this.playerService.findPlayers(1, 'userName', this.input.nativeElement.value, 'asc', 0, 20),
                                this.messagesService.getConversations())
      map(([first, second]) => {
        return { first, second };
      })
    )
    .subscribe({first, second} => this.players = first.players, this.conversations = second);
    }

Answer 2

Для каждого входного сигнала переключение на два комбинированных запроса:

ngAfterViewInit() {
  fromEvent(this.input.nativeElement, 'keyup').pipe(
    switchMap(() => forkJoin(
      this.playerService.findPlayers(1, 'userName', this.input.nativeElement.value, 'asc', 0, 20),
      this.messagesService.getConversations()
    )),
    map(([first, second]) => ({ first, second }))
  ).subscribe(({first, second}) => {
    this.players = first.players;
    this.conversations = second;
  });
}