Угловой 6: ExpressionChangedAfterItHasBeenCheckedError вызван из выпадающего события select - PullRequest
Новая
       10

Угловой 6: ExpressionChangedAfterItHasBeenCheckedError вызван из выпадающего события select

0 голосов
/ 11 мая 2018

Какие изменения кода могут исправить ошибку, описанную ниже?

Вариант использования

Раскрывающийся списокВходной интерфейс защищен от непреднамеренного изменения выбранного значения через модальный режим.Однако событие (щелчок, фокус или другое), связанное с раскрывающимся списком, вызывает ExpressionChangedAfterItHasBeenCheckedError, наблюдаемое в консоли Chrome в режиме разработки.

Наблюдаемый результат

При нажатии на раскрывающееся меню ExpressionChangedAfterItHasBeenCheckedError генерируется (см. Консоль)

Ожидаемый результат

При нажатии на раскрывающееся меню модальноеоткрывается без ошибок

Демо

Ссылка на демонстрацию в stackblitz

Примечания

  • Как описано в разделе «Все, что вам нужно знать о ExpressionChangedAfterItHasBeenCheckedError» здесь , я пытаюсь вызвать обнаружение изменений (см. Комментарии в app.component.ts: 48-49, помечен как STEP-1 и STEP-2), но безуспешно (вероятно, вызвано не в нужном месте?)
  • Модал в демоверсии не полностью реализован для [OK] и [CANCEL], так какОшибка не влияет
  • Код, который яупрощенная версия большего приложения

1 Ответ

0 голосов
/ 11 мая 2018

Какие изменения кода могут исправить ошибку, описанную ниже?

Код, подобный этому, должен вам помочь: 

<select 
  [(ngModel)]="building.venueId"
  #ngModel="ngModel"
  ^^^^^^^^^^^^^^^^^^
  get hold of NgModel instance
  ...
  (click)="ngModel.control.markAsTouched(); confirmChangeItem(building.venueId)">
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
           and prepare FormControl to the changes

Разветвленный стек-блиц

Обновление

Я забыл сказать, что в этом случае вы можете удалить cdRef.detectChanges и микрозадачу, поэтому я рад узнать, что вы догадались сами

...