Блог

Я попытался прикрепить передачу ошибок для динамической формы. Вот демонстрационный код

Я могу получить поведение, но я получаю

ExpressionChangedAfterItHasBeenCheckedError: выражение изменилось после проверки. Предыдущее значение: ‘null’. Текущее значение: ‘true’

Как изящно справиться с этой проблемой. Есть ли другой лучший способ сделать это?

Angular автоматически добавит класс ng-invalid, когда форма находится в недопустимом состоянии. вы можете использовать это для стилизации элемента вместо использования ngClass.

component.css

 .ng-invalid:not(form)  {
  border-left: 5px solid #a94442; /* red */
}
  

Разветвленный рабочий пример

Может быть, вы можете сделать что-то вроде этого:

 <input
      type="number"
      [class.error]="!data.val"
      step="any"
      #valBox="ngModel"
      required
      (ngModelChange)="changedInput($event)"
      [(ngModel)]="data.val"
/>