I really don't know how to succinctly describe what I'm trying to do so sorry for the bad title. But I have a table where I want to interlace different types of rows. I have one row that mirrors the columns across the top, and I have another row that spans all columns to show the year.

For example:

```
<table>
  <thead>...</thead>
  <tbody>
     <tr>
         <td>11/30/2013</td>
         <td>Some Description</td>
         <td>$1450.00</td>
         ...
     </tr>
     <tr>
         <td>12/31/2013</td>
         <td>Some Description</td>
         <td>$1450.00</td>
         ...
     </tr>
     <tr colspan="9">2014</tr>
     <tr>
         <td>1/31/2014</td>
         <td>Some Description</td>
         <td>$1450.00</td>
         ...
     </tr>
   </tbody>
</table>

```

Here is the straightforward implementation to put all of the data in the table:

```
<table>
  <thead>...</thead>
  <tbody>
      <tr ng-repeat="paycheck in paychecks">
         <td>{{paycheck.payDate}}</td>
         <td>{{paycheck.description}}</td>
         <td>{{paycheck.amount}}</td>
         ...
      </tr>
  </tbody>
</table>

```

However, I'd like to put this row between those rows when I traverse over a yearly boundary:

```
<tr>
   <td colspan="9" ng-if="paycheck.payDate.year > previousPaycheck.payDate.year">{{paycheck.payDate.year}}</td>
</tr>

```

This means I'd have to put two rows in the table when the above condition is true, but with ng-repeat I'm only adding one. I suspect I'll have to rebuild my data structure such that I insert the year boundaries in it so ng-repeat will be a 1:1 with rows in the table and elements in my array. Or maybe some special directive magic that could make this easier. 

Is there an easy way to do this that I don't see?