I'm having this problem that I can't assign the selected value to the formarray field. I'm using ng-autocomplete, when I select the value and i make a console.log of the form group this appear as if I selectec something and store in the respective field, but when I make a submit, I make other console.log and is empty!
this is my HTML
<fieldset formArrayName="material_guid" class="mt-4">
<fieldset name="quantites" *ngFor="let quantity of quantities.controls; let i = index" [formGroupName]="i">
<p>Material {{ i + 1 }}</p>
<ng-autocomplete [data]="dataMaterial" [searchKeyword]="keywordMaterial" (selected)='selectEventMaterialArray($event,i)' [itemTemplate]="itemTemplate" [notFoundTemplate]="notFoundTemplate" class="mb-4" placeholder="Selecciona un material" >
</ng-autocomplete>
<ng-template #itemTemplate let-item>
<a [innerHTML]="item.nombre"></a>
</ng-template>
<ng-template #notFoundTemplate let-notFound>
<div [innerHTML]="notFound"></div>
</ng-template>
<input type="number" min="1" max="3" class="form-control mb-4 mt-4" placeholder="Minimo" formControlName="minimo">
<input type="number" min="1" max="3" class="form-control mb-4" placeholder="Maximo" formControlName="maximo">
<button (click)="removeQuantity(i)" class="btn btn-danger">Quitar material</button>
</fieldset>
</fieldset>
here is where i detect when the user make the select
selectEventMaterialArray(item, index) {
this.quantities.controls[index].value.material = item.nombre
}
and here is my form group and the creation of my formarray
kanbanForm = this.formBuilder.group({
kanban_nombre: ['', Validators.required],
ubicacion: ['', Validators.required],
ruta_guid: ['', Validators.required],
kanban_guid: ['', Validators.required],
material_guid: this.formBuilder.array([]),
active: ['Y'],
})
getNewId() {
this.currentStepId += 1;
return this.currentStepId;
}
get newQuantity(): FormGroup {
return this.formBuilder.group({
id: [this.getNewId()],
material: [''],
minimo: ['', Validators.required],
maximo: ['', Validators.required],
})
}
get quantities() : FormArray {
return this.kanbanForm.get("material_guid") as FormArray
}
addQuantity() {
this.quantities.push(this.newQuantity);
console.log(this.quantities.controls)
}
I don't know what is wrong, hope someone can helpme