CODEWITHSUNDEEP
javascriptangularjsngresource
Ben Thurley
Ben Thurley

Reputation: 7141

Angular ng-resource POST sending query params not JSON

I'm trying to get my first ng-resource example working. The problem is it's sending the data as query params rather than JSON.

I have this service for my REST resource. REST_URL_PREFIX is just a constant. 

angular.module('myApp')
  .service('Test', ['$resource', 'REST_URL_PREFIX', function Test($resource, URL_PREFIX) {
     return $resource(URL_PREFIX + 'test/:id');
  }]);

Get's used like this.

var obj = {name: 'Test', num: 12345};
var objRest = new Test();
objRest.$save(obj);

I can see in the console that this calls the web service like this: 

POST http://server/rest/test?name=Test&num=12345

What I'd like is for it to call like this: 

POST http://server/rest/test

But with the JSON in the body of the request. 

{name: 'Test', num: 12345}

The content type of the request is application/json automatically so I would've thought it would send JSON?

Have I missed something? I did spend quite some time searching and there are a number of similar questions but none solved my problem.

Edit
Ultimately I want this to submit details from a form.

$scope.submit = function(test) {
  > Code to save test parameter using Test resource required here
}

Thanks

Upvotes: 0

Views: 5115

Answers (2)

Tom Maher
Tom Maher

Reputation: 2054

The original poster had the following code:

var obj = {name: 'Test', num: 12345};
var objRest = new Test();
objRest.$save(obj);

However what is not immediately obvious from the accepted answer and hence my post to try and clear this up. Is that the $save function is being used directly on the $resource service. In the context of this code the new Test() will create an instance of the angular resource class, which is used to make RESTful calls.

The function that should be being used is the save function not the $save.

The following code is what the @Ben Thurley should be using instead:

var obj = {name: 'Test', num: 12345};
var objRest = new Test();
objRest.save(obj);

The difference is VERY subtle but means that the POST call is made with query parameters instead of JSON in the http request body.

I suspect the only reason the $save method exists on the resource object is so that is can attach it to the objects it bring back during a get/query request. The documentation only mentions $save in context of it being used on one of the objects returned from a request.

So for example:

var myRESTResourceEndPoint = $resource('/foo/:bar', {bar: null});
var foo = myRESTResourceEndPoint.get({bar: 123});

Then $save is valid in this context:

foo.$save();

Where as save is valid in this context:

myRESTResourceEndPoint.save();

The confusion occurs because the following code will yield a result but not in the way that was intended:

foo.$save(foo);

or

myRESTResourceEndPoint.$save(foo);

Upvotes: 2

sylwester
sylwester

Reputation: 16498

$scope.createTest = function () {
   var newTest = new Test;
   newTest.name = "new name";
   newTest.nume="123";

    newTest.$save();

};

Upvotes: 0

Related Questions