如何在AngularJS中动态（来自JSON）创建表结构（tr元素）答案

【问题标题】：How to create table structure (tr elements) dynamically (from JSON) in AngularJS如何在AngularJS中动态（来自JSON）创建表结构（tr元素）
【发布时间】：2016-07-06 16:50:35
【问题描述】：

如何用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 元素的数量可能会有所不同。

提前致谢

【问题讨论】：

你用 angular 写过哪些代码？显示你的 json
您在寻找ng-repeat吗？这在很大程度上取决于您的 JSON / Array 的外观。
是的，我知道我应该使用“ng-repeat”，但我不知道如何提供动态行
动态行将基于 json 数据创建。您可以使用 ng-repeat 我将为此发布示例

标签： html angularjs json

【解决方案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

【讨论】：

感谢您的回答。我理解你的例子，但在我的情况下它是不同的。我不需要不同的值，例如 id、firstname、lastname。我只需要显示网站的名称。我想是这样的： {{navigationData[$index].name}} { {navigationData[$index+1].name}} {{navigationData[$index+2].name}} 但是还是不行..
所以我需要这样的东西：（示例）'[SiteA][SiteB][SiteC] [SiteAA][SiteBB][SiteCC] [SiteAAA][SiteBBB][SiteCCC]' ...总是 3 列但不同的行