CODEWITHSUNDEEP
node.jsangularjs-resource
gjanden
gjanden

Reputation: 101

Deleting posted content using $resource in AngularJS

I am new to AngularJS and am trying out a few things with posting and deleting content using $resource. I've got the posting working fine, but when I try to delete something that I've posted I get a 404 error. 

DELETE http://localhost:3000/tasks?__v=0&_id=53c5ddcf2978af0000ccdc50&beginningDat…vacy=true&title=This+is+a+complete+task&website=http:%2F%2Fwww.hotmail.com 404 (Not Found)

I've been working on this for a few days now and I'm just not seeing what i am missing. I am using a MEAN stack. I've got mongoose, express, bodyParser, and cors as dependencies in my app.js and created my endpoints:

app.get('/tasks', api.getTask);
app.post('/tasks', api.postTask);
app.delete('/tasks/:_id', api.deleteTask);

Here is the code from my api.js which 

exports.deleteTask = function(req, res){

    var _id = req.params._id;

    Task.remove({_id:_id}, function(err, task){
        res.send(task + ' removed task successfully');
        if(err){
            res.send('Hey guys...he is still here.');
        }
    });
};

Here is my factory/service:

'use strict';
    angular.module('achievementApp').factory('tasks', function($resource){
        return $resource('http://localhost:3000/tasks/',{_id: '@_id'},{
        get: {method:'GET', isArray: true},
        add: {method:'POST'},
        delete: {method: 'DELETE'}
    });
});

And here is the code from the Ctrl:

$scope.taskList = tasks.get({});
$scope.removeTask = function(obj){
    tasks.delete(obj);
    var index = $scope.taskList.indexOf(obj);
    console.log(index);
    $scope.taskList.splice(index,1);
    console.log('removeTask was called');
};

Any guidance on this would be greatly appreciated. I've tried just about everything I can to get it to work and have had no luck so far.

Upvotes: 1

Views: 658

Answers (1)

Peter Lyons
Peter Lyons

Reputation: 146064

It looks like you have a mismatch between the angular code which is putting the _id in the query string and the express code which is looking for it as a route param, which looks in the path part of the URL. req.params comes from the path part before the ?. req.query comes from the query string part after the ?. It would be more conventional to use the path in terms of REST, so I suggest changing your angularjs code to have /tasks/:_id as the resource route.

Aside: Best to use relative paths in your browser JS and omit the protocol, host, and port. Otherwise your app won't work when you deploy it on the real web.

Upvotes: 1

Related Questions