json - 我如何在不知道 name 属性的对象数组中执行 *ngFor ?

标签 json angular typescript ngfor

我有一个名为 dadosRelatorio 的数组,我需要在模板中迭代该数组,我在 http 请求中获取该数组:

[{"id": 1,
  "name": "a",
  "class":[{
     "Inglês":[{
        "id": 1,
        "code": "teste"
     },
     {
        "id": 2,
        "code": "teste 2"
     }],
     "Espanhol":[{
        "id": 1,
        "code": "a"
     }]
   }]
}]

如果类内的对象具有不同的名称属性,我如何迭代它们?有时名称可以是“Inglês”,有时可以是“Espanhol”和其他名称...

当我知道属性的名称时,我会这样做:

<div *ngFor="let aluno of dadosRelatorio" class="div-aluno">
       <span>Aluno: {{ aluno.name }}</span>
       <div *ngFor="let classe of aluno.class">
          <div *ngFor="let idioma of classe. ???>

          </div>
       </div>
</div>

但是我如何迭代类内的对象?

最佳答案

您可以使用 keyvalue 管道进行迭代,如下所示:

<div *ngFor="let aluno of dadosRelatorio" class="div-aluno">
    <span>Aluno: {{ aluno.name }}</span>
    <div *ngFor="let classe of aluno.class | keyvalue">
        <div> {{classe.key}}</div>
        <div *ngFor="let type of classe.value | keyvalue">
            {{type.key}}
            <div *ngFor="let data of type.value | keyvalue">
                {{data.value.id }}
                {{data.value.code }}
            </div>
        </div>
    </div>
</div>

关于json - 我如何在不知道 name 属性的对象数组中执行 *ngFor ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60231347/

相关文章:

json - 将多边形 json 坐标转换为 data.frame

javascript - 如何格式化 JSON 数据以在不同的 div 中显示结果对象

node.js - 无法在 npm 安装中读取 null 的属性 'startsWith'

javascript - 吞下目的地 : warn if 2 tasks try to write to the same destination

json - 如何使用 Core Data 保存 JSON 响应,在 Swift 3 中互联网离线时显示数据?

java - 解析JSON对象: Call the constructor after parsing?

Angular2 两条路线到一个组件?

angular - 创建由 JSON 驱动的动态多级菜单

javascript - Angular 2 绑定(bind)模态的关闭事件

node.js - Webpack 生产构建失败 : "Can' t resolve 'aws-sdk' "