ng-grid original row index

Question

I am customizing a cell template in ng-grid. In that cell, I want to have a button that will trigger some event that needs the row index into the original data array. The template looks like this:

<button class="btn" ng-click="removeItem(row.rowIndex)">
  <i class="icon-remove"></i>
</button>

and removeItem is implemented like this:

$scope.removeItem = function(rowIndex) { $scope.myList.splice(rowIndex, 1) }

This works until I re-sort the grid by clicking on one of the columns. Apparently, rowIndex the visual index of the row, and not the index of the row in the array I supplied.

Is there a way to obtain the actual index?

Solution 1

One easy way that i can think of would be to add a property index on the model data itself and initialize it when you get the data. This way you always have the initial row order. Something like

angular.forEach(items,function(item,index){
   item.index=index;
});

I don't think the grid provides any such mechanism.

Solution 2

Inspired by ngGrid - remove row

You can find the original index of the element using indexOf(row.entity)

HTML

<input type="button" value="remove" ng-click="removeRow(row)" />

Javascript

$scope.removeRow = function(row) {
    var index = $scope.myData.indexOf(row.entity);
    $scope.myData.splice(index, 1);
};

Full example on Plunker