I want to insert values, and then read them like this in the frontend (key is 0, 1, 2, 3...):
form?.get(['configuration','configurationMilestone', field?.nameFieldInitial1, key])
This is the method I build the form:
createControlFormArray(configuration, group) {
const config = this.form.get('configuration') as FormGroup;
const newFormArray = this.fb.array([]);
configuration.forEach(() => {
newFormArray.push(this.fb.control(null));
});
const configGroup = configuration.reduce((acc, item, index) => {
acc[item] = newFormArray.at(index);
return acc;
}, {});
const newFormGroup = this.fb.group(configGroup);
config.addControl(group, newFormGroup);
}
This is the method I want to add the value, but it's not adding the values, it gives an error:
createFormListInitialWithDefaultValue(config, dataMark, disabled = false) {
const formArray = this.form.get(['configuration','configurationMilestone', dataMark.nameFieldInitial1]) as FormArray;
formArray.value.push(this.fb.control(dataMark.defaultValue1));
}
To create the form, you basically take part of the context of a constant above:
const dataMarkInitial = {
labelName1:categoriesMenu.LABELS.RESULTS_MARKER_LABEL_1,
fieldProgress1: 'toAchieveProgressInitial',
fieldProgress2: 'toSurpassProgressInitial',
nameFieldInitial1:'resultsMarkerNameInitial',
nameFieldInitial2:'resultsMarkerPercentInitial',
nameFieldFinal1:'resultsMarkerNameFinal',
nameFieldFinal2:'resultsMarkerPercentFinal',
placeholder1: categoriesMenu.LABELS.RESULTS_MARKER_PLACEHOLDER_INITIAL_1,
placeholderStart: '0',
placeholderGoal: '100',
labelName2:categoriesMenu.LABELS.RESULTS_MARKER_LABEL_2,
matchesProgress: categoriesMenu.LABELS.MATCHES_PROGRESS,
ruleProgress1: categoriesMenu.LABELS.RESULTS_MARKER_RULE_1,
ruleProgress2: categoriesMenu.LABELS.RESULTS_MARKER_RULE_2,
defaultValue1:'',
defaultValue2:null,
defaultValue3:'PROPORTIONAL_CAL',
defaultValue4:null,
progressOptions:[
{id: 'PROPORTIONAL_CAL', name: categoriesMenu.LABELS.OPTIONS.CALCULATED_PROPORTIONALLY},
{id: 'BACK_PROGRESS', name: categoriesMenu.LABELS.OPTIONS.PROGRESS_FROM_PREVIOUS_MILESTONE}
],
disabled: true
}
const milestoneInitial = [
dataMarkInitial.fieldProgress1,
dataMarkInitial.fieldProgress2,
dataMarkInitial.nameFieldInitial1,
dataMarkInitial.nameFieldInitial2,
dataMarkInitial.nameFieldFinal1,
dataMarkInitial.nameFieldFinal2,
'progressOptions'
]
//create form
this.createControlFormArray(milestoneInitial, 'configurationMilestone');