angular - 如何在 ngFor 中显示一个简单 json 的所有键和值?
问题描述
基本上我有一个类似的json(这是一个例子,我真正的json有n个字段,它可以是动态的):
data=
[
{
"name":"paul",
"age":23,
"gender":"male"
},
{
"name":"adrian",
"age":20,
"gender":"male"
},
{
"name":"yorsy",
"age":26,
"gender":"male"
}
]
我想要输出(第一位置):
key: name, value: paul
key: age, value:23
key: gender: value:male
我该怎么做?我有一个错误,因为角度迭代了一个数组。
//in this case, I want show the first position of the data
<div *ngFor="let item of data[0]; let i=index">
key: {{item}}, value: {{item[i]}}
</div>
这是我的代码:
解决方案
如果您使用的是 Angular(v6.1.0 或更高版本),您可以使用keyvalue
Angular 包的公共模块中的管道,如下所示 -
<div *ngFor="let item of data[0] | keyvalue">
Key: <b>{{item.key}}</b> and Value: <b>{{item.value}}</b>
</div>
推荐阅读
- go - golang 中的集合
- hibernate-search - 如何在休眠搜索中索引复合主键
- android - Hilt 依赖注入,在提供的模块内滑动模块
- vue.js - 如何将 vuedraggable 用于处理 Vuex 中嵌套数据数组的数据的嵌套组件?
- api - Flutter:异常然后页面正确构建
- unity3d - Agora.io - 是否可以实时修改视频聊天
- jenkins - Jenkins - 将作业限制在某些节点上
- heroku - 为什么为生产启用 no-liquibase?
- android - 缺少权限时未调用 BLE 扫描回调
- ruby-on-rails - 无法使用 rails 安装 pg gem