In my code, I am working with an array object structured as follows:
let myArray=[
{ "id":"100",
"child1":[
{"id":"xx","Array":[]},
{"id":"yy","Array":[]},
{"id":"zz","Array":[]}
]
},
{ "id":"200",
"child1":[
{"id":"xx","Array":[]},
{"id":"yy","Array":[]},
{"id":"zz","Array":[]}
]
}
]
Additionally, I have an Angular template set up like this:
<div *ngFor="let obj of myArray">
Id:{{obj.id}}
<div *ngFor="let objChild of obj.Child1">
Id:{{objChild.id}}
Array:{{objChild.Array}}
AddElementtoArray:<button (click)="add(objChild.Array)">add</button>
</div>
</div>
I also have a method in the Angular component to handle adding elements to the arrays:
add(oArray)
{
oArray.push('xxx');
}
The issue I'm encountering is that when clicking the add button for one ID, values are added to both ID's child arrays. I've attempted filtering based on the index, but it still affects both objects. Any suggestions on how to resolve this would be greatly appreciated.