Rxjs / Typescript: ExpressionChangedAfterItHasBeenCheckedError - PullRequest
Новая
       119

Rxjs / Typescript: ExpressionChangedAfterItHasBeenCheckedError

0 голосов
/ 30 апреля 2020

Я использую ng-select пользовательский поиск на стороне сервера для загрузки данных, независимо от того, предоставил пользователь поисковый запрос или нет.

компонент. html

<ng-select [items]="filterValues$ | async"
    [typeahead]="filterValuesInput$"
    [multiple]="true"
    (open)="getFilterValues(pref.id)"
    [loading]="filterValuesLoading"
    bindLabel="name"
    [(ngModel)]="filter_values">
</ng-select>

component.ts 

getFilterValues(filterName) {
    this.filterValues$ = concat(
      of([]), // default items
      this.filterValuesInput$.pipe(
        startWith([]),
        distinctUntilChanged(),
        tap(() => this.filterValuesLoading = true),
        switchMap(term => this.preferencesService.getFilterValues(filterName, '' + term).pipe(
          map(res => res.filter_values),
          catchError(() => of([])), // empty list on error
          tap(() => this.filterValuesLoading = false)
        ))
      )
    );
}

Проблема, которую я заметил, заключается в том, что всякий раз, когда я открываю выпадающий список, он вызывает ошибку консоли: 

Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'loading: false'. Current value: 'loading: true'.

После этого загрузчик срабатывает this.filterValuesLoading работает нормально, если предоставляется условие поиска. В чем здесь проблема? Спасибо!

Ответы [ 2 ]

0 голосов
/ 04 мая 2020

Мне удалось избавиться от ошибки. this.filterValuesLoading и this.filterValuesInput$ были инициализированы с использованием ловушки жизненного цикла ngOnInit, однако использование tap(() => this.filterValuesLoading = true) вызвало ошибку, описанную в первом посте. Я удалил эту строку и поставил this.filterValuesLoading = true в начале getFilterValues() метода.

Я открыт для других предложений, так как не думаю, что это лучший подход

0 голосов
/ 02 мая 2020

Это происходит потому, что вы меняете значение filterValues$ на открытии, что не должно быть так, вам нужно определить filterValues$ один раз, вам не нужно делать это при каждом открытии, я думаю Вы можете избавиться от этой функции и запустить filterValues$ один раз. В идеале я бы определил свойство filterValues$ и присвоил бы значение только один раз, например, во время init здесь , проверил бы функцию loadPeople, вызываемую один раз во время инициализации, и они не используют генератор событий open совсем.

...