Мне нужна помощь в понимании того, как превратить эту функцию в поток для получения оперативных и актуальных результатов. - PullRequest
Новая
       6

Мне нужна помощь в понимании того, как превратить эту функцию в поток для получения оперативных и актуальных результатов.

0 голосов
/ 06 января 2020

Таким образом, я реализовал NGB-Typeahead в этом проекте, но обнаруженная функция фильтрации, которая работает для него, возвращает результат по факту. Мне нужно предоставить текущие результаты, и я считаю, что использование потоковой подписки должно работать, но использование привязки [ngbTypeahead] меня смущает.

Это в Angular 7.

Пример:

Вводимые пользователем данные: 000 Результаты: ничего, потому что у меня есть ожидание длины 3 в тексте и результатов дона не существует, когда набран 3-й символ

Вводимые пользователем данные: предыдущая + 0 Результаты: 000 00234, 12 000 034 Обратите внимание, что только 3 выделены, поскольку это предыдущий результат. Теперь изменение требует другой результат, но он не будет отображаться, пока не будет введен следующий символ. 

<input type="text" class="search" [(ngModel)]="typeAheadModel" [ngbTypeahead]="filter" [resultTemplate]="result" [inputFormatter]="NumFormatter" />

filter = (text$: Observable<string>) =>
    text$.pipe(
      debounceTime(200),
      distinctUntilChanged(),
      map(
        (term) =>
          term.length < 3
            ? []
            : (this.pageController.fetchPageSearchList(
                this._searchCriteriaSelection,
                term,
                '30'
              ),
              this._searchResults).slice(0, 5)
      )
    );

Мне трудно обернуть голову, как это сломать вплоть до действия и потока, на который можно подписаться, который будет поддерживать текущие результаты без использования методологии asyn c -await.

Заранее благодарен за любую помощь!

1 Ответ

1 голос
/ 06 января 2020

Попробуйте filter из событий, передаваемых по потоку событий.

DEMO 

filter = (text$: Observable < string > ) =>
  text$.pipe(
    debounceTime(200),
    distinctUntilChanged(),
    filter(term => term.length > 3),
    switchMap(term => this.pageController.fetchPageSearchList(term));
...