Angular 1.x Tables (Rowspan)

Following example will give the clear picture on Angular tables.

For this angular tables,we will use the ng-repeat.

Following example uses the rowSpan and colSpan.

For Highlighting the color on hover ,i used the following style.

tr:hover, tr:hover + tr {
        background:#eee;
 }

Ex : 

<table border="1">

    <tr>
        <th  >Name</th>
        <th   >MRN</th>
        <th  >Gender</th>
        <th  >Age</th>
        <th >Status</th>
        <th colspan="2"> plan </th>
        <th >Last updated</th>
</tr>
<tbody  ng-repeat="patient in names.data">
  <tr>
        <td rowspan="2">{{ patient.lastName }}, {{ patient.firstName }}</td>
    <td rowspan="2">{{ patient.mrn }}</td>
<td rowspan="2">{{ patient.mrn }}</td>
<td rowspan="2">{{ patient.gender }}</td>
<td >Status1</td>
<td>Red</td>
<td>Complaince 1</td>
<td rowspan="2">2017-11-14</td>
</tr>
 <tr>
 <td>Status2 </td>
 <td>Yellow</td>
<td>Complaince 2</td>

 </tr>
  </tbody>

</table>



Download :

https://drive.google.com/open?id=1_vENkIhEYOAJMpC6Ah6T7w2YxWyEBy77