AngularJS http服务

Question

I'm trying to send a http request, I succeeded in doing so. Thing is that when I return the value from the service, it sends an object like this:

Object {readyState: 1, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}

And the result is in responseText.

But if I print the response in the service it display the actual response. This is my service:

.service('saltalaFactory', ['$http', 'url', function($http,url){
this.getLocation = function(){
    return $.ajax({
        method: 'POST',
        dataType: 'json',
        url: 'http://alafila.cl/igniter/Appmovil/GetSucursales',
        data: {lat: '-33.4415275',lng: '-70.6517743'}
    }).done(function(response){
        return response;
    });
}
}]);

And this is the piece of code on my Controller to set the returned value to a variable:

$scope.init = function(){
    $scope.response=saltalaFactory.getLocation($scope.data.lat,$scope.data.lng);
    console.log($scope.response);
}  

If I do it by pressing a button it works on the second call, but not on the first. However I need to load this function on init. Thanks beforehand

Answer 1

You should do something like this in you service :

.service('saltalaFactory', ['$http', '$q', 'url', function($http,$q,url){
this.getLocation = function(){
var deferred = $q.defer();
$http({
  method: 'POST',
  dataType: 'json',
  url: 'http://alafila.cl/igniter/Appmovil/GetSucursales',
  data: {lat: '-33.4415275',lng: '-70.6517743'}
}).then(function(response){
  deferred.resolve(response);
}, function(error){
  deferred.reject(error);
});
return deferred.promise;
}
}]);

and in your controller you can call you service function :

$scope.init = function(){
 saltalaFactory.getLocation($scope.data.lat,$scope.data.lng)
  .then(function(result){
    $scope.response = result;
   }, function(error){
    console.log(error);
  });
 }