I am currently using Angular 10 along with the ngrx store library, but I am facing difficulty in understanding how to recursively delete items from the ngrx store. Within the store, there is a nested array of objects, and I need help with deleting an object based on its id. I attempted to use splice and a function, but encountered this error:
Cannot assign to read only property '0' of object '[object Array]'
I'm not sure what I am doing wrong, could someone please assist me?
Here's an example of the data structure:
[
{
"id": 414,
"name": "mail.ru",
"is_main": true,
"subdomains": [
{
"id": 423,
"name": "en.mail.ru",
"is_main": false,
"subdomains": [
{
"id": 429,
"name": "gw.mail1.ru",
"is_main": false,
"subdomains": [
{
"id": 426,
"name": "gw.mail3.ru",
"is_main": false,
"subdomains": []
}
]
}
]
},
{
"id": 425,
"name": "gw.mail.ru",
"is_main": false,
"subdomains": []
}
]
}
]
This is my current store reducer:
case UserInfoActionTypes.UPDATE_DOMAINS_LIST: {
return {
...state,
domainsInfo: deleteItems(state.domainsInfo, [parseInt(action.payload.id, 10)]),
errorMessage: null
};
}`
Below is the recursive function I have created for deletion:
export function deleteItems(array, ids) {
let i = array.length;
while (i--) {
if (ids.indexOf(array[i].id) !== -1) {
array.splice(i, 1);
continue;
}
array[i].subdomains && deleteItems(array[i].subdomains, ids);
}
return array;
}