angular2 add dynamic fields that comes from collection value using formBuilder - node.js

Question

I want to add dynamic input field in form using formBuilder (input comes from database ). eg. In collection i saved multiple fields and i want to create from based on that fields that i saved in collection (LIKE::-
Collections Name: Custome_fields
In above collection in save below fields
Age
Name
Height
And now i want to create input in form using above fields name:
For this i am using below that:
<div [formGroup]="studentCustomeField" *ngFor="let customField of customFields;" class="col-md-8">
<div class="form-group">
<label class="" id="Label_padding">{{customField.label | titlecase }}</label>
<input formControlName="customField.label" [(ngModel)]="student.customFields" type="text" class="form-control adstu_btn" placeholder="{{ customField.label | uppercase }}">
</div>
Below is code in my component.ts file:
this.companyService.getCustomFields()
.then(customFieldsData => {
if(customFieldsData) {
this.customFields = customFieldsData;
console.log('Testing: '+JSON.stringify(this.customFields));
this.studentCustomeField = this.formBuilder.group({
customFields.label: [''],
})
} else {
console.log('component else');
}
});

Answer 1

I do not know the exact structure, of your CustomFields object, but assuming it is something like:
const CustomFields = {
Age: 12,
Height: 13,
Name: "Antonio"
}
You can use the following code to generate the form group:
const formGroup = Object.keys(customFields).reduce((acc, curr) => {
acc[curr] = [customFields[curr], Validators.required];
return acc;
}, {});
And you will get the following object as formGroup
// {
// Age: [12, Validators.required],
// Height: [13, Validators.required],
// Name: ['Antonio', Validators.required],
// };
this.studentCustomeField = this.formBuilder.group(formGroup);