Я хочу создать реактивную форму с несколькими компонентами и хотел бы проверить все обязательные поля, когда пользователь нажимает кнопку «Отправить»

Question

Я хотел бы создать угловую реактивную форму с несколькими подкомпонентами.

Я хотел бы проверить компоненты родительской и дочерней форм за один раз (когда пользователь нажимает кнопку «Отправить»).

В моем текущем сценарии мне удалось показать сообщение об ошибке только в родительской форме, но не в дочерних компонентах, если я не коснусь их в дочерних компонентах.

Вот ссылка на редактор стекаблиц-> https://stackblitz.com/edit/angular-kenydb

Ссылка на приложение -> https://angular -kenydb.stackblitz.io

Любая помощь очень ценится.

Answer 1

Вы можете использовать группу форм и добавлять все элементы внутри группы форм.

<form [formGroup]="userForm" (ngSubmit)="onFormSubmit()">
  Name: <input formControlName="name"  placeholder="Enter Name">
  Age: <input formControlName="age"  placeholder="Enter Age">
  <button type="submit">Submit</button> 
</form> 

Answer 2

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