I have the following issue:
I've create a list that allow the user to delete an item from list, as following:
When user click on trash icon, the item is removed normally. The problem is when the user uses the filter on top.
In that case, if I delete the number 6565 (index 4 in original list, 1 on filtered list), the item deleted is on index 1 on original list, resulting on delete the register with number #564456
This is my delete call on click:
$scope.deleteOwn = function (uuid) {
console.log(uuid);
var coupon = $scope.ownsCoupons[uuid];
Coupon.delete({'id' : coupon.uuid}, function () {
$scope.ownsCoupons.splice(uuid, 1);
});
}
And this is my html template:
<td><a href="" ><i class="icon-trash" ng-click="deleteOwn($index)"></i></a></td>
I also try to use the code: $scope.ownsCoupons.splice(coupon, 1);
without success.
Does anyone know how to fix that?
I've coded using the following reference: AngularJS How to remove an Item from scope
[EDIT]
I've created a Plunker to this: http://plnkr.co/edit/Fhxp6uZyTJCY05CAQ7yA?p=preview
You can use the pop() method to remove specific elements of a list. pop() method takes the index value as a parameter and removes the element at the specified index. Therefore, a[2] contains 3 and pop() removes and returns the same as output. You can also use negative index values.
There are three ways in which you can Remove elements from List: Using the remove() method. Using the list object's pop() method. Using the del operator.
Remove an item by value: remove() You can remove the first item from the list where its value is equal to the specified value with remove() . If the list contains more than one matching the specified value, only the first is deleted.
The methods are remove(), pop() and clear(). It helps to remove the very first given element matching from the list. The pop() method removes an element from the list based on the index given. The clear() method will remove all the elements present in the list.
As mentioned by @pkozlowski.opensource, you can't depend on $index
to identify an item in an array in this way. I would make the following changes:
HTML:
<td><a ng-click="deleteWish(coupon)"><i class="icon-trash"></i></a></td>
JS:
$scope.deleteWish = function (coupon) {
var index = $scope.coupons.indexOf(coupon);
if (index != -1) {
$scope.coupons.splice(index, 1);
}
}
Here is a working Plunker: http://plnkr.co/edit/b0b2cYGsM5wtw8hIrQB5?p=preview
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With