AngularJS ajax http promise returns additional data

Question

In the promise then function when you receive the data object it is wrapped with another data object like

data = Object {data: Object, status: 200, config: Object, statusText: "OK"}

How to avoid this. you need to access your variables like data.data.myVar

var test123 = $scope.test();
    test123.then(function(data){
        console.log(data);
        // why you need to access your data in "data.data.myValue"   
    },function(data){

    });


$scope.test = function(){
        var promise =  $http(
                {
                    method: 'GET',
                    dataType: "jsonp",
                    url: 'json/requestKey.json'
                }
        )
        .success(function(data) {
            return data;
        })
        .error(function(data){
            //return data;
        });
        return promise;
};

It allows you to also access data.status or data.statusText apparently… What's wrong with that? — Bergi
– Bergi, Commented Aug 6, 2015 at 6:56

Mikko Viitala · Accepted Answer · 2015-08-06 06:57:33Z

1

Just return the data part from your "service". And you can ditch the redundant promise since $http is already a promise.

$scope.test().then(function(data) {
  console.log(data);
});

$scope.test = function() {
  return $http('json/requestKey.json').then(function(response) {
    return response.data;
  });
};

answered Aug 6, 2015 at 6:57

Mikko Viitala

8,4044 gold badges42 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

dreamweiver · Accepted Answer · 2015-08-06 06:51:55Z

0

Well this is be resolved two ways

Try returning the resulting object instead of wrapping it around another object and then returning that to the client on the server side.
In the success() callback of your $http, return data.data instead of just return data, so that in your then() function you will get the internal object.

answered Aug 6, 2015 at 6:51

dreamweiver

5,9922 gold badges27 silver badges39 bronze badges

5 Comments

Bergi Over a year ago

You cannot return from a .success callback.

dreamweiver Over a year ago

@Bergi: Isn't it same as jQuery.ajax ?

Bergi Over a year ago

No, $http (angular) is different from $.ajax (jQuery). And even in jQuery you cannot return from success callbacks, you have to use then (or pipe in old versions).

cverb Over a year ago

The succes()callback should not be used anymore as it is deprecated since Angular 1.4.

dreamweiver Over a year ago

@cverb:yeah i realised that

artisanbhu · Accepted Answer · 2016-12-09 23:21:12Z

When you are returning, HttpResponseMessage, REST api response data in this format,

Object {data: Object, status: 200, config: Object, statusText: "OK"}

To parse in ajax success call back,

  $http.get(urlBase + '/get/' + id).then(function (response) {
                  var yourData = response['data'];
                  var yourStatusCode = response['status'];
                  var yourStatusText = response['statusText'];

                  //assign data to any other $scope object 
                  $scope.product = yourData;
              }, function (error) {
                            console.log('error occured!!');
              });

You will do fine now, you don't need to change the response from web api now.

Collectives™ on Stack Overflow

AngularJS ajax http promise returns additional data

3 Answers 3

Comments

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related