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

我希望这是您要寻找的。