JavaScript
formGroup = this.fb.group({});
constructor(private readonly formBuilder: UntypedFormBuilder){}
ngOnInit() { this.setFields(); }
setFields() {
this.formGroup.addControl('username', this.fb.control('', Validators.required));
this.formGroup.addControl('password', this.fb.control('', Validators.required));
this.formGroup.addControl('email', this.fb.control('', Validators.required));
}
CSS
<ng-container *ngFor="let field of formGroup.controls">
//display form control or component
<input type="text" [formControlName]="field.name" class="form-control">
</ng-container>
I attempted to use ngFor, but it didn't work because the form builder group is an object and not an array. I understand there is a form array, however, that is not the solution I am looking for.
How can I loop through the form group controls?