Within the function filterchildrenByRegion(), I am receiving an API response.
My goal is to eliminate objects that do not match the selected Region and return all data as it is.
Example 1 - If I input '1UL Africa' into the changeRegion() function, it will produce the expected output 1.
Example 2 - If I input 'South Africa"' into the changeRegion() function, it will generate the expected output 2.
changeRegion(){
this.newRegion = this.filterchildrenByRegion('1UL Africa');
}
filterchildrenByRegion(region){
this.data = [
{
"name": "Africa",
"children": [
{
"name": "Test1",
"region": "1UL Africa"
},
{
"name": "Test2",
"region": "South Africa",
},
{
"name": "Test3",
"region": "New Test",
}
]
},
{
"name": "Europe",
"children": [
{
"name": "Test4",
"region": "1UL Africa"
},
{
"name": "Test5",
"region": "Test Europe"
}
]
}
];
return this.data.filter(x => x.children.map(child => child.region).includes(regionName));
};
Expected Output 1
result = [
{
"name": "Africa",
"children": [
{
"name": "Test1",
"region": "1UL Africa"
}
]
},
{
"name": "Europe",
"children": [
{
"name": "Test4",
"region": "1UL Africa"
}
]
}
];
I attempted the following code, but it returned an empty result:
getClusterObjectByRegion(regionName: string) {
this.data = this.clusterFactoryList;
return this.data.map((x) => {
const childrenMatchingSearch = x.children.filter(c => c.buSubRegion.includes(regionName));
if (childrenFulfillingTheSearch.length === 0) {
return undefined;
}
return {
...x,
children: childrenMatchingSearch
};
}).filter(x => x !== undefined);
};
Expected Output 2
result = [
{
"name": "Africa",
"children": [
{
"name": "Test1",
"region": "1UL Africa"
}
]
}
];