Обнаружение изменений не запускается, когда ошибки установлены в реактивных формах

Question

Я на углу 7, и я использую реактивные формы для одной из моих форм, и код, как показано ниже. (Stackblitz Здесь )

Template

 <form [formGroup]="SignupForm" *ngIf="SignupForm">
   <input type="text" class="form-control" id="username" formControlName = "username">
   <div *ngIf="SignupForm.errors?.errors">Error</div>
 </form>

Машинопись

export class AppComponent implements OnInit {
  SignupForm: FormGroup;

  constructor() {

  }

  ngOnInit() {
    setTimeout(() => {
      this.SignupForm = new FormGroup({
        'username': new FormControl('Value'),
        'email': new FormControl()
      });
      this.SignupForm.setErrors({errors: 'Error'});
    })
  }
}

Как вы можете видеть, я пытаюсь установить ошибку, как только форма инициализируется (в моем случае я бы сделал некоторую проверку на основе данных бэкэнда, а затем сделал бы это.). Но, похоже, ошибка не появляется, даже если SignupForm.errors установлено с объектом ошибки.

Но если я сделаю

setTimeout(() => { this.SignupForm.setErrors({errors: 'Error'});}) 

Все отлично работает. Я делаю что-то неправильно или это угловая ошибка, о которой я могу сообщить. Пожалуйста помоги. Спасибо.

Примечание

На самом деле, моя форма происходит из бэкэнда, который является асинхронным. После того, как я создаю форму из метаданных, я делаю проверку и устанавливаю ошибки. Поэтому переход к любому крюку жизненного цикла не изменит никакого поведения, я полагаю.

Answer 1

вы можете написать setErrors on ngAfterViewInit

вот пример TS

export class AppComponent implements OnInit {
SignupForm: FormGroup;

constructor() {
}

ngOnInit() {
   this.SignupForm = new FormGroup({
     'username': new FormControl('Value'),
    'email': new FormControl()
  });
}

ngAfterViewInit(){
     this.SignupForm.setErrors({errors: 'Error'});
}

позвольте мнезнать, работает ли он или нет.