javascript - 在 Angular 中搜索嵌套对象
问题描述
我在 Angular 应用程序中搜索嵌套数组时遇到问题。我必须访问 package.name。请帮忙谢谢enfoiewfhfofhfowfoewhfowfoewhfwefwfhowefweofhew8ofwofhewofw8eofhwf
JSON
[{
"id": 1,
"name": "Yeah",
"package_id": 1,
"price": 100,
"package": {
"id": 1,
"name": "Yeah"
}
}]
TS
search(event) {
const val = event.target.value.toLowerCase();
if (!val) {
this.users = this.tempUsers;
}
const temp = this.tempUsers.filter((row) => {
return Object.keys(row).some((property) => {
return row[property] === null ? null : row[property].toString().toLowerCase().indexOf(val) !== -1;
});
});
this.users = temp;
}
TS
getAllUsers() {
this.usersService.getAll()
.subscribe(
(data: any) => {
console.log(data);
this.users = data.Users;
this.tempUsers= [...this.users];
},
error => {
console.log(error);
});
}
解决方案
根据您的数据,您可以使用以下过滤器;
const filteredData = data.filter((item) => item.price.toString() === val || item.package_id.toString() === val || item.package.name.toString().toLowerCase().indexOf(val) !== -1 );
// 用代码更新
search(event) {
const val = event.target.value.toLowerCase();
const filteredData = this.users.filter((item) => item.price.toString() === val ||
item.package_id.toString() === val ||
item.package.name.toString().toLowerCase().indexOf(val) !== -1 );
this.users = filteredData ;
}
推荐阅读
- javascript - 我怎样才能使这种语法成为可能: var a = (5).plus(3).minus(6); //2
- azure - 跨订阅的 Azure Active Directory 角色
- vim - 对两个匹配项之间的模式进行操作,包括两个匹配项
- c#-3.0 - 从文件中读取并将文本添加到表单上已有的标签控件
- c# - 在代码中更改 UWP 文本时,某些字体无法正确显示,尤其是图标字体
- html - 带有 SVG 背景的 DIV 不会完全覆盖父级
- react-bootstrap-typeahead - 使用 React-bootstrap-typeahead 无法正确加载 CSS
- r - 数据表:将观察结果添加到所有组并分配取决于其他行的值
- amazon-web-services - AWS Beanstalk 上的元数据库部署失败
- ios - 如何使用 CSCustomAttributeKey 从 Spotlight 中获取自定义值