ExpressionChangedAfterItHasBeenCheckedError Обновление валидатора вложенной формы из родительского

Question

Я создал несколько реактивных подформ, которые я подключил к родительской группе форм, используя FormGroupDirective, но когда я обновляю валидаторы подформ от родителя в ngAfterViewInit, когда элементы управления былидобавил, и вызвать updateValueAndValidity Я получаю эту ошибку в консоли:

ERROR
Error: ExpressionChangedAfterItHasBeenCheckedError: 
Expression has changed after it was checked. 
Previous value: 'ng-valid: true'. Current value: 'ng-valid: false'.

Можно ли избежать этой ошибки?Я создал StackBlitz проблемы, и вы можете увидеть, как ошибка появляется в консоли, когда приложение загружается, когда я устанавливаю валидатор описания профиля и вызываю updateValueAndValidity в ngAfterViewInit из PageComponent.

Answer 1

Вы можете запустить обнаружение изменений в своем хуке:

import { ChangeDetectorRef } from '@angular/core';

constructor(private changeDetector: ChangeDetectorRef) { }

public ngAfterViewInit() {
  ...
  this.changeDetector.detectChanges();
}

Или использовать onPush обнаружение изменений:

import { ..., ChangeDetectionStrategy } from '@angular/core';

@Component({
  ...
  changeDetection: ChangeDetectionStrategy.OnPush
})

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