I have created an application in angularJS using ng-Table, In the application I am using grouping feature of ng-Table, The application is working fine for single table which is shown in a sample as given below
Single Table with grouping in a single Controller
But the problem is that in my application I am using two tables within a single controller, when i tried to put two tables with grouping feature I am not getting the table displayed
Can anyone please tell me some solution for this
Two Tables with grouping in a single Controller
<body ng-app="main" ng-controller="DemoCtrl">
<table ng-table="firstTableParams" class="table">
<tbody ng-repeat="group in myData.$groups">
<tr class="ng-table-group">
<td colspan="{{$columns.length}}">
<strong>{{ group.value }}</strong>
</td>
</tr>
<tr ng-repeat="user in group.data">
<td sortable="name" data-title="'Name'">
{{user.name}}
</td>
<td sortable="age" data-title="'Age'">
{{user.age}}
</td>
</tr>
</tbody>
</table>
<table ng-table="secondTableParams" class="table">
<tbody ng-repeat="group in myAnotherData.$groups">
<tr class="ng-table-group">
<td colspan="{{$columns.length}}">
<strong>{{ group.value }}</strong>
</td>
</tr>
<tr ng-repeat="user in group.data">
<td sortable="name" data-title="'Name'">
{{user.name}}
</td>
<td sortable="age" data-title="'Age'">
{{user.age}}
</td>
</tr>
</tbody>
</table>
</body>
iterate over $groups
<tbody ng-repeat="group in $groups">
in second plunk ,it must be like,since you resolving data by defer
,each table process its own data
<body ng-app="main" ng-controller="DemoCtrl">
<table ng-table="firstTableParams" class="table">
<tbody ng-repeat="group in $groups"> //changed here
<tr class="ng-table-group">
<td colspan="{{$columns.length}}">
<strong>{{ group.value }}</strong>
</td>
</tr>
<tr ng-repeat="user in group.data">
<td sortable="name" data-title="'Name'">
{{user.name}}
</td>
<td sortable="age" data-title="'Age'">
{{user.age}}
</td>
</tr>
</tbody>
</table>
<table ng-table="secondTableParams" class="table">
<tbody ng-repeat="group in $groups"> //changed here
<tr class="ng-table-group">
<td colspan="{{$columns.length}}">
<strong>{{ group.value }}</strong>
</td>
</tr>
<tr ng-repeat="user in group.data">
<td sortable="name" data-title="'Name'">
{{user.name}}
</td>
<td sortable="age" data-title="'Age'">
{{user.age}}
</td>
</tr>
</tbody>
</table>
</body>