2

我从分层的服务器接收到一个集合。即,我有一个包含系列的研究列表。例如,我从服务器获得以下对象。

var studies = [ {studyDescription: 'Study1', series:[ 
                                                {seriesDescription:'Series1'}, 
                                                {seriesDescription:'Series2'}
                                              ]
                }];

“系列”嵌套在研究中。

我正在使用 HTML 表格来显示这些数据。而且我想在显示时展平层次结构。即表格应如下所示:

 Study         Series
 --------------------
 Study1        Series1
 Study1        Series2  ---> Study1 repeats for each series it contains

我使用 ng-repeat 来迭代行:

 <tr ng-repeat="study in studies">
      <td>{{studyDescription}}</td>
      // HOW to repeat for each series ????
 </tr>

如何使用 AngularJS ng-repeat 指令显示这样的分层数据?我之前尝试过使用,但没有奏效。基本上我需要多个 for 循环来多次重复行。如何实现这一点。

谢谢。

4

2 回答 2

4

您可以使用多个tbody迭代系列:

HTML:

<table border=1>
    <thead>
        <th>Studies</th>
        <th>Series</th>
    </thead>
    <tbody ng-repeat="study in studies">
        <tr ng-repeat="series in study.series">
            <td>{{study.studyDescription}}</td>
            <td>{{series.seriesDescription}}</td>
        </tr>
    </tbody>
</table>

这是 JSFiddle :

http://jsfiddle.net/L3MWJ/1/

告诉我它是否适合你,我仍然不确定它是否适用于所有浏览器。

于 2013-06-02T20:49:57.887 回答
0

您是否尝试过嵌套的 ng-repeat ?尝试这个 :

  <tr ng-repeat="study in studies">
      <td>{{study.studyDescription}}</td>
     <td> 
         <span ng-repeat="serie in study.series"></span>
               <p>  {{serie.seriesDescription}}</p>
     </td>
 </tr>
于 2013-05-27T09:39:15.527 回答