I need help to dynamically create an array with nested objects holding again an array of objects each. The structure is as follows:
tiles=[
{ "row": [{isChecked: true, src: ''}, {isChecked: true, src: ''}, {isChecked: true, src: ''}] },
{ "row": [{isChecked: true, src: ''}, {isChecked: true, src: ''}, {isChecked: true, src: ''}] },
{ "row": [{isChecked: true, src: ''}, {isChecked: true, src: ''}, {isChecked: true, src: ''}] },
{ "row": [{isChecked: true, src: ''}, {isChecked: true, src: ''}, {isChecked: true, src: ''}] }
];
However, the amount of row objects and amount of rows is dynamic. In the example above, it's 3 x 4.
My current approach is a simple nested loop:
updateTileEditor(x: number, y: number) {
this.tiles = [];
for (var i = 0; i < y; i++) {
let helperArray = [];
for (var j = 0; j < x; j++) {
helperArray.push({ isChecked: true, src: '' });
}
this.tiles.push({ "row": helperArray });
}
}
Could you perhaps propose a more feasable approach to this?
Be aware that every nested object of the nested array must be a different object. In other words, the objects can not point to the same reference.
Thanks in advance!