Question

我刚准备了一个数据，想要在html表中显示，但问题是每次调用$ http服务时都返回n列。基本上我想要显示的是第一行数据应该用于列名，其余的是行。当然列名不固定，可能有n列。以下是样本数据：

[["Product",2016,2017],["A",50.92,550],["B",10,0],["C",20,0]]

or 

[["Product",2015, 2016,2017],["A",80, 50.92,550],["B",20, 10,0],["C",75,20,0]]

我尝试了这个但没有得到如何将第一行打印为列并显示下面的剩余行。

<table style="width:100%; font-size:11px; " ng-repeat="(key, value) in NewTable">

  <thead>
    <tr style="background-color:#00372B; height: 50px; ">
      <th style="padding:1%; color:white;" colspan="3">{{ key }}:{{value}}</th>
    </tr>

  </thead>
</table>

请求某人使用角度过滤器提供解决方案，以便我也可以在表格上添加一些计算列。感谢。

Answer 1

根据提供的数据确定，试一试

<table>
  <thead ng-repeat="columns in NewTable | limitTo:1">
    <tr ng-repeat="column in columns">
      <th>{{ column }}</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="rows in NewTable.slice(1,NewTable.length)">
      <td ng-repeat="row in rows">{{ row }}</td>
    </tr>
  </tbody>
</table>

其中NewTable是角度控制器/组件中的数据数组。

使用angularjs为html表

1 个答案: