I have an Ionic List with items including an attribute from the directive ion-delete-button (see docs).
I fill the list using ng-repeat in the following matter:
HTML
<ion-list>
<ion-item class="item item-thumbnail-left item-text-wrap"
ng-repeat="albumname in Albums track by $index"
href="#/tab/dash/{{Albums[$index]}}">
<img ng-src="{{thumbnailImage(albumname, 'album')}}" class="thumbnail-album">
<h2 style="padding-top: 20px">{{albumname}}</h2>
<!--WORKS FINE, CHANGES NAME OF $index -->
<ion-option-button class="button-energized" ng-click="changeAlbumName($index)">Change Name</ion-option-button>
<!-- DOES NOT WORK AS EXPECTED, ON PHONE DELETES ALL ALBUMS -->
<ion-delete-button class="ion-minus-circled" ng-click="deleteAlbum($index)"></ion-delete-button>
</ion-item>
</ion-list>
Controller
// Initialized and Refreshed on Updates
$scope.Albums = DashFactory.getAlbums();
$scope.deleteAlbum = function(index) {
console.log(index) // SHOWS CORRECT INDEX
var confirmPopup = $ionicPopup.confirm({
title: 'Delete Album: ' + $scope.Albums[index],
template: 'Are you sure you want to delete this album?'
});
confirmPopup.then(function(res) {
if(res) {
console.log('You are sure');
DashFactory.deleteAlbum(index); // SERVICE FOR DELETING THE ALBUM
$ionicListDelegate.showDelete(false);
} else {
console.log('You are not sure');
}
});
}
Service (DashFactory)
var Albums = ['foobut', 'barplug', 'fooin', 'barass']
var deleteAlbum = function(index) {
Albums.splice(index);
this.saveAlbums();
};
var getAlbums = function() {
return Albums;
};
Array.splice need more than one parameter, it will now remove everything starting from the index you gave. Try Album.splice(index,1);
Solved it. Basically you have to write:
Array.splice(index, amount)
where amount is 1, the number of items you are removing. Otherwise it removes it all.