Angular 遍歷嵌套的 object 的最佳方法是什么

Question

我正在嘗試遍歷名為購買下面顯示的嵌套 object。 它有一個名為 purchaseProducts 的子數組，其中包含名為 products 的子數組以及一些其他數據。

遍歷這種類型的嵌套 object 的最佳方法是什么？

我試過 *ngFor 這樣

<div *ngFor = "let data of purchase "> 
        {{data.date | slice: 0:10}}
        {{data.totalprice}}

    <div *ngFor="let product of purchase.purchaseProducts">

          {{product.id}} // not working
          {{product.quantity}} //not working
          {{product.price}}
          {{product.products.name}}
    </div>
</div>

但內部 div 不顯示值。

提前謝謝你

Answer 1

您的 json 中沒有purchase_product ，我認為您應該使用data.purchaseProducts ：

<div *ngFor = "let data of purchase "> 
        {{data.date | slice: 0:10}}
        {{data.totalprice}}

    <div *ngFor="let product of data.purchaseProducts">

          {{product.id}} // not working
          {{product.quantity}} //not working
          {{product.price}}
          {{product.products.name}}
    </div>
</div>

Answer 2

使用<div *ngFor="let product of data.purchaseProducts">代替<div *ngFor="let product of purchase.purchase"> 。 這是因為purchaseProduct是data的關鍵