how to patchvalue in edit page of nested array in angular8? - angular8

Question

html code:(Here i added the html code to iterate the nested array which i want to get the value in edit page ) getMaterialListArray(i) => this method should iterate the array values when i click the select+ button.
<p>Sub Recipes</p>
<div formArrayName="recipeArray" *ngFor="let item of recipeArray.controls; let i = index;">
<div [formGroupName]="i" class="add-div" >
<mat-accordion>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
Sub Recipe{{i+1}}
</mat-panel-title>
</mat-expansion-panel-header>
<div class="add-div">
Material
<mat-list role="list" formcontrolName="material">
<mat-list-item role="listitem" *ngFor="let data of getMaterialListArray(i)">
<div class="file-name">
<span>{{data.title}}</span>
<div>{{item.wt_in_kgs_per_unit}}{{item.uom}}</div>
<div class="btn-custom" (click)="deleteMaterial(data, i)">Delete</div>
</div>
</mat-list-item>
</mat-list>
</div>
<div class="btn-custom" (click)="addMaterial(i)">select+</div>
<br><br>
<div class="add-div">
otherFormulation
<mat-list role="list">
<mat-list-item role="listitem" *ngFor="let form of getFormulationListArray(i)">
<div class="file-name">
<span>{{form.title}}</span>
<div>{{form.batch_qty}}{{form.unit_type}} </div>
<div class="btn-custom"(click)="deleteOtherFormulation(form, i)">Delete</div>
</div>
</mat-list-item>
</mat-list>
</div>
<div class="btn-custom" (click)="addOtherFormulation(i)">select+</div>
</mat-expansion-panel>
</mat-accordion>
</div>
</div>
component.ts:(commented lines are gives an error. please give me an solution to patch value from nested array) the pattern of an array)
List : [] = array[{
internalCode:Fo-3684,
title:biscuit,
refer_subrecipe:[{
material_id:[{ title:biscuit,
internalCode:Fo-3434
},
{
title:cake,
internalCode:Fo-3488
}]
}],
Refer_packaging:[{
material_id:[{
title:candywrapper,
uom:10kg
},
{
title:candypack,
uom:20kg
}]
}] like this....
this.formulationForm.patchValue({internalCode : result.internalCode,
myCode:result.myCode,
title : result.title,
unitsOfMeasurement:result.unit_type,
batchQuantity:result.batch_qty,
productType:result.product_type,
// recipeArray: {
// material:result.Refer_SubRecipe.material_id.title,
// otherformulations:result.Refer_SubRecipe.material_id.title
// },
// packageArray:{
// packMaterial:result.Refer_Packaging.material_id.title,
// UOM:result.Refer_Packaging.material_id.uom,
// weight:result.Refer_Packaging.material_id.wt_in_kgs_per_unit,
// Quantity:result.Refer_Packaging.material_id.quantity
// },
allergen:this.alergenList,
shelf_life:this.alergenList,
operational_instruction:result.ops_instructions,
version_no:result.version,
version_date:result.version_date,
approved_by:result.approved_by,
remarks: result.remarks });
}
})
this.recipeArray = this.formulationForm.get('recipeArray') as FormArray;
this.packageArray = this.formulationForm.get('packageArray') as FormArray;
}