Angular Parent Form + childForm

i got a question i havent found an answer too and i was curious if one of you came across this.

Imagine having a ParentForm and a ChildForm. Child and Parent are each one Angular Component.

parentForm: FormControl = new FormBuilder.group({})

childForm: FormControl = new FormBuilder.group({
checkbox: false,
})


now if i want to add the childForm to the parentForm to connect them, i would do:

@(ViewChild)(ChildComponent) = childComponent;

ngAfterViewInit(): {
this.parentForm.addControl('childFormName', this.childComponent.childForm)
}


This whole action would make the ParentForm look like this:

parentForm: {
childFormName: {
checkbox: false
}
}


I dont want this, i would like to not have to give the added form an extra name, and would want to have it look like this:

parentForm: {
checkbox: false
}


Has anyone every ecountered a usecase for this?

thanks for the help in advance

Continue reading...