How to repeat two more rows to each in AngularJS

Question

The following table row is typical.

<tr ng-repeat="item in items">
    <td>{{item.id}}</td>
    <td>{{item.subject}}</td>
    <td>{{item.author}}</td>
    <td>{{item.date}}</td>
</tr>

but, how to repeat two rows to each?

<tr ??>
    <td rowspan=2>{{item.id}}</td>
    <td colspan=2>{{item.subject}}</td>
</tr>
<tr ??>
    <td>{{item.author}}</td>
    <td>{{item.date}}</td>
</tr>

Answer 1

If you're using AngularJS 1.2+, you can use ng-repeat-start and ng-repeat-end:

<tr ng-repeat-start="item in items">
    <td rowspan=2>{{item.id}}</td>
    <td colspan=2>{{item.subject}}</td>
</tr>
<tr ng-repeat-end>
    <td>{{item.author}}</td>
    <td>{{item.date}}</td>
</tr>

See "Special repeat start and end points" in the ngRepeat docs.

Otherwise, you have to resort to some nasty tricks, like wrapping the trs in a tbody element and repeating that.