CODEWITHSUNDEEP
angularjshtml-tablecol
Dev
Dev

Reputation: 1007

AngularJS ng-repeat colspan rowspan issue

<table border=1>
 <thead>
   <tr>
      <th>Group</th>
      <th>Status</th>
     <th>Name</th>
     <th>Gender</th>          
   </tr>
 </thead>    
 <tbody ng-repeat="group in groups">
   <tr>
     <td rowspan="3">{{group.name}}</td>  
     <td rowspan="3">{{group.status}}</td>        
   </tr>
   <tr ng-repeat="member in group.members">
     <td>{{ member.name }}</td>
     <td>{{ member.gender }}</td>
   </tr>
 </tbody>
</table>

The above code gives the output as below:

enter image description here

I need to make the Status column the 4th column instead of the current 2nd i.e appear after the Gender column. I tried using ng-repeat-start by adding one more tr having the status td but it comes as another row

JS-Bin for the same

Upvotes: 1

Views: 5681

Answers (1)

xsh.7
xsh.7

Reputation: 6250

Using ng-if checking the $index using modulo (%) for the columns with a rowspan might do the trick: jsbin.com/jaxuvavaba

Upvotes: 1

Related Questions