$broadcast appending dynamic data (rows) at wrong place using ng-scrollbar - angularjs

Question

I have used ng-scrollbar like this :
<tbody ng-scrollbar rebuild-on="rebuild:me" class="scrollme" id ="tempID">
and in ng table , included the broadcast
getData: function($defer, params) {
$scope.$broadcast('rebuild:me');
Now the ng-repeat is populating the tr in thead after first th instead of appending/loading it correctly in tbody
how to correctly display my results?

Answer 1

did you try this
getData: function($defer, params) {
$defer.promise.then(function(){
$scope.$broadcast('rebuild:me');
};
...
right after updating table
Edit 1
tbody is replacing by div and thus how layout became messy,check plunk
Edit 2
Here some workaround about this,need some editing,i will update later
Edit 3(final)
Finally get working example of ngtable and ngscrollbar together,but its not most beautiful solution but still:
1.
you need separate thead from rest of table into new table which locate right above main table
<thead>
<tr >
<th class="sortable" ng-class="{
'nameasc':'sort-asc' ,
'namedesc':'sort-desc'
}[sortTableParam]"
ng-click="SortBy('name')">
<div>name</div>
</th>
<th class="text-center sortable" ng-class="{
'ageasc':'sort-asc' ,
'agedesc':'sort-desc'
}[sortTableParam]"
ng-click="SortBy('age')">
<div>Age</div>
</th>
</tr>
</thead>
</table>
2.
second - hide thead in main table and wrap table into div tag,which will be processing by directive:
<div style="height:300px" ng-scrollbar rebuild-on="rebuild:me" class="scrollme">
<table ng-table="tableParams" show-filter="true" class="table">
<thead><tr><th ></th><th ></th></tr></thead>
<tbody >
<tr ng-repeat="user in $data">
<td data-title="'Name'" filter="{ 'name': 'text' }" sortable="name">
{{user.name}}
</td>
<td data-title="'Age'" sortable="age">
{{user.age}}
</td>
</tr>
</tbody>
</table>
</div>
3.
Clicks from header will trigger reloading data with sorting option,by binding SortBy function
var sorting = $scope.tableParams.$params.sorting;
var dir = sorting != null ? (sorting[param.toString()] == 'asc' ? 'desc' : 'asc') : 'asc';
var sort={};
sort[param.toString()]=dir;
$scope.tableParams.sorting(sort);
//edit classes in header for rows imaging(check plunk)
updatesorting(param);
};