ng-repeat 内的 ng-repeat 和每个项目的 td - AngularJS

Question

此代码为我提供了一个表格，其中包含单列中的元素。

这里的数据会是这样的

var data = [[{"id":"1","value":"One"},{"id":"2","value":"Two"},{"id":"3","value":"three"}],[{"id":"4","value":"four"},{"id":"5","value":"five"},{"id":"6","value":"six"}],[{"id":"7","value":"seven"},{"id":"8","value":"eigth"},{"id":"9","value":"nine"}]]

<div id="mydiv">
    <table>
       <tr ng-repeat="rows in data">
           <td ng-repeat="item in rows">{{item.id}}:{{item.value}}</td>
        </tr>
    </table>
</div>

这给了我一个三列的表格。喜欢

1:One 2:Two 3:three
4:four 5:five 6:six
7:seven . . .

除此之外，我希望表格在一列中包含item.id : 在一列中，item.value 在一列中以提高可读性，而不是在一列中。

尝试这样做但无法使其正常工作，有人可以帮助我吗？

Answer 1

你应该这样定义你的表：

<div id="mydiv">
    <table>
        <tr ng-repeat="rows in data">
            <td ng-repeat-start="item in rows">{{item.id}}</td>
            <td>:</td>
            <td ng-repeat-end>{{item.value}}</td>
        </tr>
    </table>
</div>

欲了解更多信息，请参阅Special repeat start and end points section of the ngRepeat documentation：

为了重复一系列元素而不仅仅是一个父元素，ngRepeat（以及其他 ng 指令）支持通过使用 ng-repeat-start 和 ng-repeat 定义显式起点和终点来扩展重复器的范围-分别结束。 ng-repeat-start 指令的工作方式与 ng-repeat 相同，但会重复所有 HTML 代码（包括定义它的标签），直至并包括放置 ng-repeat-end 的结束 HTML 标签。