Reputation: 610
How can I check what is really happening in the below delete function? Every time I delete it says "Success" but the UI doesn't update .
HTML
<md-content >
<div id="main" class="well">
<table cellpadding="20" class="table table-bordered table-striped">
<tr>
<th ng-repeat="(head, value) in models[0]">
<span>{{head}}</span>
</th>
</tr>
<tr ng-repeat="row in models">
<td ng-repeat="(name, value) in row" ng-scope>
<span ng-click="" ng-bind="row[name]"></span>
</td>
<td >
<a target="_self" href="#" ng-click="downlaodId(row)">Downlaod</a>
</td>
<td >
<a target="_self" href="#" ng-click="deleteId(row)" confirmation-needed="Really Delete?">Delete</a>
</td>
</tr>
</table>
</div>
</md-content>
Controller
$scope.deleteId = function (idPassed) {
fileLoadService.delete({ 'id': idPassed.id }, function(successResult) {
alert('Deleted');
}, function (errorResult) {
// do something on error
if (errorResult.status === 404) {
alert('Ooops');
}
});
};
my UI looks like this after click delete fileLoadservice
app.factory('fileLoadService', ['$resource',
function ($resource) {
return $resource(
"http://jsonplaceholder.typicode.com/todos/:id",
{ id: "@id" },
{ query: { 'method': 'GET', isArray: true }
});
}]);
Upvotes: 3
Views: 129
Reputation: 4480
As you can see from your code:
$scope.deleteId = function (idPassed) {
fileLoadService.delete({ 'id': idPassed.id },function(successResult) {
alert('Deleted');
}, function (errorResult) {
You are doing nothing to the current model, just sending an alert Deleted
when you hit the delete button. If you want it to do something else..... you should put that functionality in the code.
For example:
$scope.deleteId = function (idPassed) {
fileLoadService.delete({ 'id': idPassed.id },function(successResult) {
var index = $scope.models.indexOf(idPassed);
$scope.models.splice(index, 1);
alert('Deleted');
}, function (errorResult) {
Upvotes: 3