Angular - Remove a row after filtering a table

Question

I have a table with filter's like :

ng-repeat="person in filtered = ( data | filter:query | filter : name | filter {m_resource: resourceFilter} | filter : {m_id : idFilter} | limitTo:maxRowSize )"

And inside the table as part of each row, I have a delete button:

<button class ="btn" ng-click="removeRow($data, $index, this)">del</button>

when clicking on the button I want the row to be removed from the UI, without using any filter I just use splice:

$scope.data.splice(index, 1);

But when I am applying filter it wont work beacuse the index(numer of the row in the displayed table) is the UI index not the data index. Anyone know's how to delete a row after filtering?

Answer 1

Try this,

<button class ="btn" ng-click="removeRow(person)">del</button>

In your removeRow function,

var index = $scope.data.indexOf(person);
$scope.data.splice(index, 1);