Angular2：ng用於遍歷對象數組

Question

例如，使用以下JSON：

{
  "TableRows": [
    {
      "Name": "Lord of the Rnis",
      "Length": "2:40"
    }
  ],
  "Category": "Fantasy"
}

進入這些類：

export interface IMovies{
    Category: string;
    TableRows: ITableRows[];
}

export interface ITableRows{
    Name: string;
    Length: string;
}

以下ngFor邏輯效果很好，但這不是我想要循環的內容：

<tr *ngFor="let row of rows">
    <td>{{row.Category}}</td>
    <td>{{row.TableRows[0].Name}}</td>
    <td></td>
</tr>

此邏輯不起作用：

<tr *ngFor="let row of rows.TableRows">
     <td>{{row.Name}}</td>
     <td>{{row.Length}}<td>
</tr>

我在這里做錯了什么？

Answer 1

就您而言，您的第一條陳述將無效。

第一句話

<tr *ngFor="let row of rows">
    <td>{{row.Category}}</td>
    <td>{{row.TableRows[0].Name}}</td>
    <td></td>
</tr>

這是不工作，因為ngFor在angular 2是類似於的ng-repeat在angular 1 。 為了使ngFor正常工作，循環項必須是一個數組，在您的情況下，行是一個對象，而不是一個數組，因此顯然它是行不通的。

在你的第二個陳述中

<tr *ngFor="let row of rows.TableRows">
     <td>{{row.Name}}</td>
     <td>{{row.Length}}<td>
</tr>

循環項rows.TableRows是一個只有一個元素的數組，因此可以正常工作並產生以下輸出

Lord of the Rnis    2:40

我希望這是您要尋找的。