$ http angularjs

Question

के साथ परिणाम डेटा प्राप्त नहीं कर सकता है मैं $ http का उपयोग करने की कोशिश कर रहा हूं, लेकिन यह नल परिणाम क्यों लौटाता है?

angular.module('myApp') 
.factory('sender', function($http) { 
    var newData = null; 
    $http.get('test.html') 
     .success(function(data) { 
      newData = data; 
      console.log(newData) 
     }) 
     .error(function() { 
      newData = 'error'; 
     }); 
    console.log(newData) 
    return newData 
}) 

कंसोल कहते हैं: http://screencast.com/t/vBGkl2sThBd4। मेरा नया डेटा पहले शून्य क्यों है और फिर परिभाषित किया गया है? इसे सही तरीके से कैसे करें?

Answer 1

यह जावास्क्रिप्ट कोड असीमित है।

console.log(newData) 
return newData 

अंदर क्या success

newData = data; 
console.log(newData) 

पहली बार में

तो, newData रिक्त है से पहले मार डाला है

(आप इसे रिक्त होने के लिए सेट) और जब http प्रतिसाद दिया जाता है (अंदर सफलता), नया डेटा अपना नया मूल्य प्राप्त करता है।

यह जावास्क्रिप्ट में बहुत आम है, आपको success के अंदर अपना पूरा काम करना चाहिए। ताकि आप सुनिश्चित करें कि सभी कार्यों या प्रदर्शन तर्क यह है कि डेटा है कि आपके $http.get() द्वारा दिया जाता है पर निर्भर हैं, तदनुसार संभाल हो जाता है कि बनाने की जरूरत है

Answer 2

रूप YardenST कहा, $http अतुल्यकालिक है। एक तरह से यह पूरा करने के "वादा" कि $http रिटर्न का उपयोग करना है:

Plunkr Demo

var myApp = angular.module('myApp', []); 

myApp.factory('AvengersService', function ($http) { 

    var AvengersService = { 
     getCast: function() { 
      // $http returns a 'promise' 
      return $http.get("avengers.json").then(function (response) { 
       return response.data; 
      }); 
     } 
    }; 

    return AvengersService; 
}); 


myApp.controller('AvengersCtrl', function($scope, $http, $log, AvengersService) { 
    // Assign service to scope if you'd like to be able call it from your view also 
    $scope.avengers = AvengersService; 

    // Call the async method and then do stuff with what is returned inside the function 
    AvengersService.getCast().then(function (asyncCastData) { 
      $scope.avengers.cast = asyncCastData; 
    }); 

    // We can also use $watch to keep an eye out for when $scope.avengers.cast gets populated 
    $scope.$watch('avengers.cast', function (cast) { 
     // When $scope.avengers.cast has data, then run these functions 
     if (angular.isDefined(cast)) {   
      $log.info("$scope.avengers.cast has data"); 
     } 
    }); 
});