I am using custom filter to create the sort order from but least first followed by next but getting error "ERROR TypeError: Cannot read property 'filter' of undefined"
.
Please help me to fix as it's not allowing to render anything on page.
What changes do I need to make to fix this? Any help is appreciated.
table-filter.pipe.ts
import { Pipe, PipeTransform } from "@angular/core";
@Pipe({
name: "tableFilter"
})
export class TableFilterPipe implements PipeTransform {
transform(list: any[], filters: any) {
//console.log("table-filter", list);
const keys = Object.keys(filters).filter(key => filters[key]);
const filterUser = (user: { [x: string]: any }) =>
keys.every(key => {
if (key == "sdob") {
return (
new Date(user["dob"]) >=
new Date(new Date(filters[key]).setHours(0, 0, 0, 0))
);
} else if (key == "edob") {
return (
new Date(new Date(filters[key]).setHours(0, 0, 0, 0)) >=
new Date(user["dob"])
);
} else if (
key === "dl" &&
user["assigned_to"].filter((e: { dl: any }) => e.dl === filters[key])
.length
) {
return user;
} else if (key === "score") {
const low = filters[key] === "20" && user["score"] <= filters[key];
const medium =
filters[key] === "50" && user["score"] < 50 && user["score"] >= 21;
const high =
filters[key] === "70" && user["score"] < 70 && user["score"] >= 51;
const veryHigh = filters[key] === "71" && user["score"] >= 71;
if (low || medium || high || veryHigh) {
return user[key];
}
} else {
return user[key] === filters[key];
}
});
if(list) {
let filterList = list.filter(filterUser);
list.sort((lhs, rhs) =>this.lowestScore(lhs.assigned_to) - this.lowestScore(rhs.assigned_to));
}
//console.log(filterList, list);
return keys.length ? list.filter(filterUser) : list;
}
lowestScore(assign: any) {
//console.log("assign ", assign);
let filterData = assign.filter(item => Number(item.co_score));
let leastScrore = Math.min(...filterData.map(item => item.co_score));
//console.log("least ", leastScrore);
return leastScrore;
}
}
I am using custom filter to create the sort order from but least first followed by next but getting error "ERROR TypeError: Cannot read property 'filter' of undefined"
.
Please help me to fix as it's not allowing to render anything on page.
What changes do I need to make to fix this? Any help is appreciated.
table-filter.pipe.ts
import { Pipe, PipeTransform } from "@angular/core";
@Pipe({
name: "tableFilter"
})
export class TableFilterPipe implements PipeTransform {
transform(list: any[], filters: any) {
//console.log("table-filter", list);
const keys = Object.keys(filters).filter(key => filters[key]);
const filterUser = (user: { [x: string]: any }) =>
keys.every(key => {
if (key == "sdob") {
return (
new Date(user["dob"]) >=
new Date(new Date(filters[key]).setHours(0, 0, 0, 0))
);
} else if (key == "edob") {
return (
new Date(new Date(filters[key]).setHours(0, 0, 0, 0)) >=
new Date(user["dob"])
);
} else if (
key === "dl" &&
user["assigned_to"].filter((e: { dl: any }) => e.dl === filters[key])
.length
) {
return user;
} else if (key === "score") {
const low = filters[key] === "20" && user["score"] <= filters[key];
const medium =
filters[key] === "50" && user["score"] < 50 && user["score"] >= 21;
const high =
filters[key] === "70" && user["score"] < 70 && user["score"] >= 51;
const veryHigh = filters[key] === "71" && user["score"] >= 71;
if (low || medium || high || veryHigh) {
return user[key];
}
} else {
return user[key] === filters[key];
}
});
if(list) {
let filterList = list.filter(filterUser);
list.sort((lhs, rhs) =>this.lowestScore(lhs.assigned_to) - this.lowestScore(rhs.assigned_to));
}
//console.log(filterList, list);
return keys.length ? list.filter(filterUser) : list;
}
lowestScore(assign: any) {
//console.log("assign ", assign);
let filterData = assign.filter(item => Number(item.co_score));
let leastScrore = Math.min(...filterData.map(item => item.co_score));
//console.log("least ", leastScrore);
return leastScrore;
}
}
Share
Improve this question
asked Jan 14, 2021 at 5:45
Kunal VijanKunal Vijan
4452 gold badges10 silver badges34 bronze badges
4
-
put a check at the beginning
if(!filters){ return list}
– Nilesh Patel Commented Jan 14, 2021 at 5:51 - @NileshPatel where do I update this? – Kunal Vijan Commented Jan 14, 2021 at 5:55
-
before
const keys = Object.keys(filters).filter(key => filters[key]);
. it may be breaking at one more place.. but try this – Nilesh Patel Commented Jan 14, 2021 at 6:02 - @NileshPatel list is undefined – Kunal Vijan Commented Jan 14, 2021 at 6:04
4 Answers
Reset to default 3The error indicates that one of the objects you are calling ".filter" on is undefined. That would be one of these lines:
const keys = Object.keys(filters).filter
- will fail if "filters" has no keys. This looks like a likely candidate if you aren't passing filters to your transform function.
user["assigned_to"].filter
- will fail if
user
doesn't have this property or if it isn't an array.
let filterData = assign.filter
- will fail if
lowestScore
is passedundefined
Depending on your browser, you could also do:
return list?.filter(filterUser) || list
The error message is plaining this:
return keys.length ? list.filter(filterUser) : list;
When your list
is undefined, and you have keys
, it will try to do list.filter
, since list
is undefined, you got such error.
Try installing
ng g pipe searchFilter