如何在 angular html page usigng ngFor 中打印所有数据

Question

我有一个如下的数据收集，我需要使用 ngFor 循环在 HTML 页面上打印这些信息。

[
{_id: "5ed387946094abebeaa6e75a", name: "Andaman and Nicobar Islands", active: 0, cured: 33, death: 0},
{_id: "5ed387946094abebeaa6e75b", name: "Andhra Pradesh", active: 1654, cured: 2576, death: 73},
{_id: "5ed387956094abebeaa6e75c", name: "Arunachal Pradesh", active: 44, cured: 1, death: 0},
{_id: "5ed387966094abebeaa6e75d", name: "Assam", active: 1651, cured: 498, death: 4},
{_id: "5ed387966094abebeaa6e75e", name: "Bihar", active: 2342, cured: 2225, death: 29},
{_id: "5ed387966094abebeaa6e75f", name: "Chandigarh", active: 77, cured: 222, death: 5},
{_id: "5ed387976094abebeaa6e760", name: "Chhattisgarh", active: 633, cured: 244, death: 2}
]

Answer 1

选项 1：json管道

<ng-container *ngFor="let item of state">
{{ item | json }}
</ng-container>

选项 2：keyvalue管道

<ng-container *ngFor="let item of state">
<ng-container *ngFor="let property of item | keyvalue">
{{ property.key }}: {{ property.value }}
</ng-container>
</ng-container>

选项 3：直接访问属性

<ng-container *ngFor="let item of state">
{{ item?.name }}
{{ item?.active }}
{{ item?.cured }}
{{ item?.death }}
...
</ng-container>