I would like to create a form and use a new, custom component for its controls. So I created a new component and included it into the parent form. But although the parent fo
You should also be passing the formGroup
instance along with control name
to your custom component
. And then create a form control
under that formGroup
in custom component. Your custom component will create the control virtually under the same formGroup that you have provided.
custom.component.ts
import { Component, Input, OnInit } from '@angular/core';
@Component({
selector: 'ava-form-control',
template: `
`
})
export class FormControlComponent implements OnInit {
@Input() label: string;
@Input() formGroup: FormGroup;
@Input() controlName: string;
constructor() {}
ngOnInit() {
let control: FormControl = new FormControl('', Validators.required);
this.formGroup.addControl(this.controlName, control);
}
}
With this your parent component can access all the form controls defined within their respective custom components.