NgbModal в Angular HttpErrorInterceptor, срабатывающий из бросков выбора ExpressionChangedAfterItHasBeenCheckedError - PullRequest
Новая
       35

NgbModal в Angular HttpErrorInterceptor, срабатывающий из бросков выбора ExpressionChangedAfterItHasBeenCheckedError

1 голос
/ 09 октября 2019

Мой очень специфический сценарий:

У меня есть выбор с двухсторонней привязкой NbModel и обработчиком (изменения). 

<select
    id="dropdownDoesNotWork"
    [(ngModel)]="value1"
    (change)="onChange($event.target.value);"
  >
    <option value="">Select</option>
    <option value="400">400: Bad Request</option>
  </select>

обработчик onChange вызывает API с HttpClient, что приводит к ошибке

Ошибка обнаруживается в HttpInterceptor, где открывается модальный режим ng-bootstrap.

В этот момент возникает следующая ошибка:

Ошибка: ExpressionChangedAfterItHasBeenCheckedError: Выражение изменилось после его проверки. Предыдущее значение: 'ng-нетронутый: true'. Текущее значение: 'ng-untouched: false'.

Я могу обойти эту проблему, изменив шаблон таким образом, чтобы элемент управления select отмечался как затронутый в выводе (change). 

  <select
    id="dropdownWorks"
    [(ngModel)]="value2"
    #selectModel="ngModel"
    (change)="selectModel.control.markAsTouched(); onChange($event.target.value);"
  >
    <option value="">Select</option>
    <option value="400">400: Bad Request</option>
  </select>

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

Есть ли альтернативный способ открыть этот мод без вызова этой проблемы?

Stackblitz https://stackblitz.com/edit/angular-expression-changed-issue

Репо https://github.com/rcollette/angular-expression-changed-issue

...