AngularJS access JSON Object returned from $http.get

Question

I try to access to json object generated by google api.

function getAvengers() {
    return $http.get('https://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA')
        .then(getAvengersComplete)
        .catch(getAvengersFailed);

    function getAvengersComplete(response) {
        return response.data;
    }

    function getAvengersFailed(error) {
        console.log('XHR Failed for getAvengers.' + error.data);
    }
}
TestCtrl.dataTest = dataservice.getAvengers();
console.log(TestCtrl.dataTest.status);

Log generate undefined. Could you help me?

Thanks

Answer 1

As getAvengers returns with a promise, you cannot use it's result as an immediate value, but you can subscribe to it's resolution. See a promise tutorial for more details.

function getAvengers() {
    return $http.get('https://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA')
        .then(getAvengersComplete)
        .catch(getAvengersFailed);

    function getAvengersComplete(response) {
        return response.data;
    }

    function getAvengersFailed(error) {
        console.log('XHR Failed for getAvengers.' + error.data);
    }
}
TestCtrl.dataTest = null;
dataservice.getAvengers().then(function(data) {
  TestCtrl.dataTest = data;
  console.log(TestCtrl.dataTest.status);  
});