I want to merge same value in table

Question

I have same value in this <td>{{key}}</td> so i don't want to display again and again i want to merge it in single enter image description here

<tbody ng-repeat="(key, val) in myctrl.dep">
   <tr ng-repeat="(key_data, val_data) in val">
   <td>{{key}}</td>
   <td>{{key_data}}</td>
   <td>{{val_data.no_of_transaction || 0}}</td>
   <td>{{val_data.total_amount || 0}}</td>                                         
   </tr>
</tbody>

How to achive this

Answer 1

For the child ng-repeat, you have same value for key it seems. You can make use of rowspan like this to achieve it:

<tbody ng-repeat="(key, val) in myctrl.dep">
   <tr ng-repeat="(key_data, val_data) in val">
   <td ng-show="key_data === 0" rowspan="{{val.length}}">{{key}}</td>
   <td>{{key_data}}</td>
   <td>{{val_data.no_of_transaction || 0}}</td>
   <td>{{val_data.total_amount || 0}}</td>                                         
   </tr>
</tbody>

Notice that we will only show that for first (using key_data === 0 which is your index). And, we rowspan it till the length of child ng-repeat.