javascript - 如何使用 ng-repeat 访问嵌套的 json 以构建表

Question

我想建立一个看起来像这样的表：table

我在我的数据集中尝试了一些东西，但是由于数据是嵌套的，我不知道如何在我的 html 中使用 ng-repeat 显示它们。

resultsJ1,2,3 和 listnqJ1,2,3 也是列表，因此我们必须能够访问列表的元素

   
table = [
  { day: " Day1" , webservices : [
                  {ws: resultsJ1, tnq : listnqJ1 }
                  ]
  },
  { day: " Day2", webservices : [
                  {ws :resultsJ2, tnq : listnqJ2 }
                  ]
  },
  { day: " Day3" , webservices : [
    {ws :resultsJ3, tnq : listnqJ3 }
    ]
}
  ]

  $scope.listnqJ1 = tableau[0].webservices[0].tnq;
  $scope.listnqJ2 = tableau[1].webservices[0].tnq;
  $scope.listnqJ3 = tableau[2].webservices[0].tnq;



  $scope.resultsJ1 = tableau[0].webservices[0].ws;
  $scope.resultsJ2 = tableau[1].webservices[0].ws;
  $scope.resultsJ3 = tableau[2].webservices[0].ws;
    

self.tableau = tableau

我发现在我的 html 中，它适用于 resultsJ1,2,3 列表，但我在显示第 1、2、3 天的结果时遇到了很大的问题：listnqJ1,2,3。

 <table cellpadding="20" rules="GROUPS" frame="BOX">
    <thead>
      <tr>
        <th>Web Service</th>
        <th style="width: 100px" ng-repeat="day in ctrl.tableau ">
          {{day.jour}}
        </th>
      </tr>
    </thead>
<tbody>
  <tr style="width: 100px" class="xl153" ng-repeat="ws in resultsJ1 track by $index">
    <td>{{ws}}</td>

    <td style="width: 100px" class="xl153" ng-repeat="day in ctrl.tableau" >
     
        <td
          style="width: 100px"
          class="xl153"
          ng-repeat="tnq in listnqJ1 track by $index"
        >
          {{tnq}}
        </td>
      </td>

  </tr>
  <tr  class="xl153" ng-repeat="ws in resultsJ2 track by $index">
    <td>{{ws}}</td>

</tbody>
  </table>

标签： javascriptjsonangularjsnestedangularjs-ng-repeat