angular - Angular ng-select 仮想スクロール機能

Question

私のページは、*ngFor ディレクティブによって作成されたいくつかのng-select (カスタム サーバー側検索) ドロップダウンで構成され、各ドロップダウンから複数の項目を選択する可能性があります。

仮想スクロール機能も含めたいのですが、別のサーバー リクエストを作成し、filterValues$値を更新して新しいデータを含める方法がわかりません。

component.html

<ng-select [items]="filterValues$[filter.name] | async"
         [typeahead]="filterValuesInput$[filter.name]"
         [virtualScroll]="true"
         [multiple]="true"
         [closeOnSelect]="false"
         [loading]="filterValuesLoading[filter.name]"
         [(ngModel)]="filter.filter_values"
         (scrollToEnd)="onScrollToEnd(filter.name)"
         (open)="onFilterOpen(filter.name)"
         typeToSearchText="No values found"
         bindLabel="name">
</ng-select>

component.ts

onScrollToEnd(filterName) {
    this.fetchMore(filterName);
}

fetchMore(filterName) {
    this.filterValues$[filterName] = combineLatest(this.getFilterValues(filterName, this.afterKey), of(this.existingValues))
      .pipe(
        map(combined => {
          return combined[1].concat(combined[0])
        })
    );
}

getFilterValues(filterName, after) {
    return this.filterValuesInput$[filterName].pipe(
      tap(() => this.filterValuesLoading[filterName] = true),
      startWith(''),
      distinctUntilChanged(),
      switchMap(term  => this.search.getFilterValues(filterName, '' + term, '' + after).pipe(
        tap(res => {
          this.afterKey = res.after_key;
          this.filterValuesLoading[filterName] = false;
          this.existingValues = this.existingValues.concat(res.filter_values);
          this.totalFilterValues = res.total_hits;
          //this.bufferLength += this.initialValues.length;
        }),
        map(res => res.filter_values),
        catchError(() => of([])) // empty list on error
      ))
    )
}

どんな助けでも大歓迎です！

更新されたコードで編集:仮想スクロール機能を実装することができましたが、ドロップダウンの一番下に移動するたびに、fetchMore()メソッドがトリガーされ、値がリセットさthis.filterValues$[filterName]れ、ドロップダウンが下から上に移動します。どうすればそれを防ぐことができますか?