filtervalue = {
serviceLine:['cca','ga']
}
this.inProgresDetailsData = [{serviceLine:'cca'}, { serviceLine:'cca'}, { serviceLine:'bca'}]
this.hrResourceDetailsdata= this.inProgresDetailsData.filter(item => {
for (let index = 0; index < filterValue.serviceLine.length; index++) {
item.serviceLine == filterValue.serviceLine[index]
}
});`
this.hrResourceDetailsdata is empty on filtering
The Array.prototype.filter (documentation) function expects you to return a boolean value that decides whether to keep the current item or not.
Since you are originally not returning any value, you implicitly return undefined which when checked against a boolean resolves to false, hence, all of your array items are discarded one by one, leaving none remaining.
You want to return the boolean to make this work:
this.hrResourceDetailsdata = this.inProgresDetailsData.filter(item => {
for (let index = 0; index < filterValue.serviceLine.length; index++) {
if (item.serviceLine == filterValue.serviceLine[index]) {
return true; // return true if found, otherwise continue
}
}
return false; // filter is never found in loop, fall back to false
});
Also, you can use Array.prototype.includes (documentation) to simplify your check, the following code does the exact same thing:
this.hrResourceDetailsdata = this.inProgresDetailsData.filter(item => {
// return true if `item.serviceLine` is inside `filterValue.serviceLine`
return filterValue.serviceLine.includes(item.serviceLine);
});
You can create a Set out of filterValue.serviceLine and filter out the items that are present in the set.
const
filterValue = { serviceLine: ["cca", "ga"] },
inProgressDetailsData = [
{ serviceLine: "cca" },
{ serviceLine: "cca" },
{ serviceLine: "bca" },
],
filterSet = new Set(filterValue.serviceLine),
hrResourceDetailsdata = inProgressDetailsData.filter(({ serviceLine }) =>
filterSet.has(serviceLine)
);
console.log(hrResourceDetailsdata);If you want to apply multiple filters, then:
Sets.const
filterValue = {
serviceLine: ["cca", "ga"],
urgency: ["medium", "high"],
},
filterSet = Object.fromEntries(
Object.entries(filterValue).map(([k, v]) => [k, new Set(v)])
),
inProgressDetailsData = [
{ id: 1, urgency: "low", serviceLine: "cca" },
{ id: 2, urgency: "medium", serviceLine: "cca" },
{ id: 3, urgency: "low", serviceLine: "bca" },
{ id: 4, urgency: "high", serviceLine: "ga" },
{ id: 5, urgency: "low", serviceLine: "abc" },
],
hrResourceDetailsdata = inProgressDetailsData.filter((data) =>
Object.entries(filterSet).every(([k, v]) => v.has(data[k]))
);
console.log(hrResourceDetailsdata);Code
filtervalue = {
serviceLine:['cca','ga']
};
this.inProgresDetailsData = [
{ serviceLine:'cca'},
{ serviceLine:'cca'},
{ serviceLine:'bca'}
];
this.hrResourceDetailsdata = this.inProgresDetailsData.filter(item => {
return filtervalue.serviceLine.includes(item.serviceLine)
});
console.log(this.hrResourceDetailsdata)