-1

i have a large form so i dived it into 3 component and used them using tabs like 1.tab1 opens component-1 2.tab2 open component-2 3.tab3 open component-3

i create form in the parent component and used the form in the child component using formGroup Directive like this

      <ng-container [formGroup]="Form">
        <Component-1
          formGroupName="form1"
          *ngIf="OpenTab == 'Component1'"
        ></Component-1>

        <Component-2
          formGroupName="form2"
          *ngIf="OpenTab == 'Component2'"
        ></Component-2>
        <Component-3
          formGroupName="form3"
          *ngIf="OpenTab == 'Component3'"
        ></Component-3>

      </ng-container>

in my component-2 i have a form and a table when the user fill the form it shows in the table and user can fill the form multiple task so their is multiple rows in a table . and in componet-3 i have to send all the 3 forms in the api (form 2 as an array) i know that i need formArray in my component-2 but i dont know how to implement it i already completed component-1 and component-2 but i cant figure it out how to work with component-2.

Abhishek Agarwal
  • 87
  • 3
  • 11

1 Answers1

1

What I understand from your question is that you've broken down your form into sub-form components.

You can nest a formArray inside a formGroup like this:

this.form = this.formBuilder.group({
    myArray: this.fb.array([]),
    // other fields
})
Vasileios Kagklis
  • 784
  • 1
  • 4
  • 14