Angularjs Resource URL

Question

I'm a beginner with AngularJS, and can't find my error in this code

   var myCarResource = $resource('cars/:carId', 
        {
            carId:'@id'
        });
    var car = myCarResource.get({id:'abc'});

Expected URL : .../cars/abc

The called URL is: .../cars?id=abc

I'm using angularjs v1.2.24

Can anyone help me? Thanks

Answer 1

As stated in the $resource paramDefaults documentation:

Given a template /path/:verb and parameter {verb:'greet', salutation:'Hello'} results in URL /path/greet?salutation=Hello.

If the parameter value is prefixed with @ then the value for that parameter will be extracted from the corresponding property on the data object (provided when calling an action method). For example, if the defaultParam object is {someParam: '@someProp'} then the value of someParam will be data.someProp

This suggests that any verb defined in the parameterizd url that matches the keys defined in the $resource's parameter defaults or the $resource class methods(get, save, etc..) parameters will have the corresponding value of that key replace the verb in the url. The '@' notation on the other hand, was not explained properly in this context, it should have been:

If the parameter value is prefixed with @ then the value for that parameter will be extracted from the corresponding property on the data object (provided when calling an instance action method).

Instance action methods($get, $save, $delete, etc..), are methods that are used for data objects retrieved using $resource class action methods. These are usually helpful when chaining requests with the same resources.

EXAMPLE DEMO

Let's assume that your cars/abc returns a response json of:

{
  "id": "abc"
}

Read the comments showing the responses of each action method invocation.

var myCarResource = $resource('cars/:carId', 
{
  carId:'@id'
});


// This sends a GET request '/cars/?id=abc
myCarResource.get({id:'abc'}); 

// This sends a GET request '/cars/abc'
myCarResource.get({carId:'abc'}); // returns {"id": "abc"}

myCarResource.get({carId:'abc'}).$promise.then(function(car) {

  // sends a POST request '/cars/abc', it replaces the :carId verb from the
  // @id notation you have defined in the parameter default. It also sends,
  // other parameter defaults defined with '@' that are defined as verbs in the url.
  car.$save();

});