html - 如何在 AngularJS 中动态地(从 JSON)创建表结构(tr 元素)

Question

如何用json数据动态填充下表html结构？ (使用 AngularJS)。

这是基本的 HTML 结构:

<table class="some styling">
                    <tbody>
  <tr>
    <td><a title="test" href="#"><span>Just some tests</span></a></td>
    <td><a title="test" href="#"><span>Just some tests</span></a></td>
    <td><a title="test" href="#"><span>Just some tests</span></a></td>
  </tr>
  <tr>
  <td><a title="test" href="#"><span>Just some tests</span></a></td>
  <td><a title="test" href="#"><span>Just some tests</span></a></td>
  <td><a title="test" href="#"><span>Just some tests</span></a></td>
  </tr>
 </tbody>
</table>

困难的部分是如何确定“tr”元素。 1 个 tr 元素中总是有 3 个 td 元素。只有 TD 元素的数量可能会有所不同。

提前致谢

Answer 1

Html:
<table border="1" style="border-collapse: collapse">
      <tr>
        <th>id</th>
         <th>firstname</th>
          <th>lastname</th>
      </tr>
      <tr ng-repeat="user in users">
        <td>{{user.id}}</td>
        <td>{{user.firstname}}</td>
        <td>{{user.lastname}}</td>
        </tr>
    </table>  

JSON:

$scope.users=[
    {id:1,firstname:"naresh",lastname:"kumar"},
    {id:2,firstname:"suresh",lastname:"kumar"},
    {id:3,firstname:"harish",lastname:"kumar"},
    ]

这是我发布的示例，您可以对其进行操作。你可以在这里看看https://plnkr.co/edit/umC2hwECePaAqZ0huYoK?p=preview