angular - 我无法迭代对象 Object
问题描述
我有这样的嵌套 JSON
{"id":1,"category":"cat","iconUrl":"www.test.com","subCategoryEntity":[{"id":3,"subCategory":"sub3","products":[]},{"id":2,"subCategory":"sub2","products":[]},{"id":1,"subCategory":"sub1","products":[{"id":1,"fileDownloadUri":"http://localhost:8081/api/v1/downloadFile/paint-bucket-orange-2-300x300.jpg","productName":"Name","productPrice":20.0,"productDesc":"this is the discreption","productStock":15,"productImages":[]}]}]}
我需要遍历所有子类别并获取子类别中的所有产品
这是我的 Angular 代码
<div *ngFor="let item of allProducts| keyvalue">
{{item.key}}:{{item.value}}
</div>
解决方案
要迭代所有子类别中的所有产品,您可以执行以下操作:
<div *ngFor="let subCategory of allProducts.subCategoryEntity">
<div *ngFor="let product of subCategory.products">
{{product.id}}-{{product.productName}}
</div>
</div>
我认为这就是你想要的,它不是最好的方法。
我建议您遍历 'allProducts' 和 'subCategories' 并提取变量中的产品以仅执行一个 'ngFor'
推荐阅读
- angular - 尽管绑定到值属性而不是占位符,但提交时用于更新数据的 Angular Reactive Forms 输入的默认值是“未定义”
- python - 浮动python的字符串 - 格式不正确?
- java - IntelliJ 停止格式化许可证标头
- bash - Shell - 对目录中的所有文件执行 imagemagic 并存储结果
- python - 在 Jupyter Notebooks 中呈现交互式 Pygal 图表
- html - 如何在伪元素之后居中?
- javascript - 带视频的模态
- prestashop - prestashop atal 错误:“字段列表”中未捕获的未知列“h.live_edit”
- facebook-graph-api - Facebook Graph API Explorer 未显示 Instagram 帐户
- postman - 将 IBM Watson Text-to-Speech 与 Postman 一起使用?