如何使用 AngularJS 1 创建具有对象数组属性的表行？答案

【问题标题】：How can I use AngularJS 1 to create table rows with the attributes of an array of objects?如何使用 AngularJS 1 创建具有对象数组属性的表行？
【发布时间】：2017-05-04 14:07:24
【问题描述】：

到目前为止，我只找到了将对象放在行中的示例(1)(2)(3)，但我需要将对象放在列中，将它们的属性放在行中。

JSON 示例：

[
  {
    name: 'peanut butter',
    price: 0.99
  }
  {
    name: 'strawberry jelly',
    price: 0.99
  }
  {
    name: 'white bread',
    price: 2.99
  }
]

所需表格示例：

【问题讨论】：

我猜你需要首先检查你获得的所有可用属性，并基于此创建一个列表。然后在此列表上为表格行执行 ng-repeat。在此内部对列中的对象进行第二次 ng-repeat。 {{attr.name}} - 如果您不需要动态版本，请按照 Konrad 在他的回答中建议的那样使用硬编码的行列表。
当我需要构建可重用指令时，我会尝试这样做。感谢您的提示！

标签： angularjs html-table

【解决方案1】：

我想你想要这样的东西。

角度模板：

<table>
  <tr>
    <th>Name</th>
    <th ng-repeat="item in yourList">{{ item.name }}</th> 
  </tr>
  <tr>
    <td>Price</td>
    <td ng-repeat="item in yourList">{{ item.price }}</td> 
  </tr>
</table>

【讨论】：