CODEWITHSUNDEEP
angularjsngtable
user1177440
user1177440

Reputation:

AngularJs - $index order on change not correct

I have an ng-table with sortable [draggable rows]. However, when a row is dragged, sometimes the new index is incorrect.

Code:

<table class="table table-striped table-hover" data-ng-table="vm.tableParams" data-export-csv="csv">
  <tbody row-sortable="vm.items"  data-ui-sortable="" data-ng-model="vm.items" >
  <tr data-ng-repeat ="item in vm.items | filter: vm.searchInput">
   <td data-title="'Index'" style="white-space: nowrap; width: 35px;">
    <div style="padding-left: 10px;"> {{$index +1}} </div>                      
   </td> 
 </tr>
   ....

 </table>

Before:

enter image description here

After:

enter image description here

As you can see, after dragging Item 2 to the bottom of the list, while it should have an ($index+1) index of 8, it has 7, and whereas item 8 should have an index of 7 it has 8.

I know this is not my code as I tried quite a few plunkers from other people on angular drag and the index sometimes is incorrect too. I do not knwo if it is a bug or what.

Nevertheless, I thought to perhaps do a $watch on the change order and then loop thru the items in the list and assign a new index value.

Can anyone suggest suitable code?

Upvotes: 0

Views: 877

Answers (1)

shaunhusain
shaunhusain

Reputation: 19748

Instead of relying on $index write a function that returns index of the element from the array.

Was on a tablet there so couldn't respond entirely. Basically something like this in your controller:

$scope.getIndex = function(item){
  return $scope.myModel..sourceArray.indexOf(item);
}

then in your HTML

<div ng-repeat="someItem in myModel.sourceArray>{{getIndex(someItem)}}</div>

Upvotes: 1

Related Questions