Data field is missing from HTTP response object. How can I access it?

Question

I want to access the order data by using

$scope.hero.order = response.data;

But it gives an error of undefined and when I check the response object there is no data field which is normally presents , Can anybody highlight my mistake?

OrderService.js

angular.module('Orders')
    .service('OrderService', ['$http', '$state', '$resource', '$q', 'SettingService', '$localStorage', "MessageService",
     function($http, $state, $resource, $q, SettingService, $localStorage, MessageService) {
        var orderResource = $resource(SettingService.baseUrl + "api/orders/:id", {id:'@id'}, {'query':{method:'GET', isArray:false}, 'update':{method:'PATCH'}});
        var service = {
getOrder : function(OrderId, successCallback, failureCallback){
                orderResource.query({id:OrderId}, successCallback, failureCallback);
         }
        }
        return service;
    }]);

Answer 1

You get "error of undefined" because the first argument of orderResource.query() 's success callback is the response body (order object in your case), not response object. So, your success callback function should look like:

function(order, getResponseHeaders, status, statusText) {
  $scope.hero.order = order;
  ...
}

You can refer to $resource 's document :

Success callback is called with (value (Object|Array), responseHeaders (Function), status (number), statusText (string)) arguments

What you do now (try to get order object from response.data ) is the behavior of $http ( doc ) -- $http 's success callback will receive a response object, whose data field refer to the http response body. However, it is different for $resource -- body, headers, status etc. are all passed as parameter in sequence.

It seems AngularJS should align the behavior, but unfortunately it doesn't.