我如何在我不知道名称属性的对象数组中执行 *ngFor？

Question

我有一个名为 dadosRelatorio 的数组，我需要在我的模板中进行迭代，这个数组是我在 http 请求中获得的：

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

如果 class 中的对象具有不同的名称属性，我如何迭代这些对象？有时名称可以是 "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>

但是我如何迭代 class 中的对象？

Answer 1

您可以使用 Object.keys 枚举对象键。参见 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys。

编辑：您也可以使用官方文档中描述的键值管道：https://angular.io/api/common/KeyValuePipe

我以为还有一个 ngForIn 指令，但我找不到文档。

Answer 2

您可以使用 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>

我如何在我不知道名称属性的对象数组中执行 *ngFor？

How i can do a *ngFor in a array of objects that i don't know the name property?

json

angular

typescript

ngfor

我如何在我不知道名称 属性 的对象数组中执行 *ngFor？

How i can do a *ngFor in a array of objects that i don't know the name property?

json

angular

typescript

ngfor

我如何在我不知道名称属性的对象数组中执行 *ngFor？