2013-02-03 30 views
9

ile sonuç verileri alınamıyor $ http kullanmaya çalışıyorum ama null null sonucunu döndürüyor?

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 
}) 

Konsol: http://screencast.com/t/vBGkl2sThBd4. Neden newData'm null ve niçin tanımlandı? Nasıl doğru yapılır?

+0

Hey, cevabım sonsuza kadar açık kalmaz böylece onu kabul edin sonra ne olduğunu ise . Şerefe! – GFoley83

cevap

5

Bu JavaScript kodu zaman uyumsuz.

console.log(newData) 
return newData 

ilk seferde Yani success

newData = data; 
console.log(newData) 

içinde newData boş olanı önce idam mı içeride (

(eğer boş değerli ayarlı) Ve http yanıtı döndürüldüğünde başarı), newData yeni değerini alır.

Bu, Javascript'te çok yaygındır, tüm çalışmalarınızı success içinde yapmanız gerekir.

+0

Tamam, anlıyorum. Teşekkür ederim! – Ilia

20

YardenST'in belirttiği gibi, $http, eşzamanlı değildir, bu nedenle $http.get() tarafından döndürülen verilere bağlı olan tüm işlevlerin veya görüntüleme mantığının buna uygun şekilde ele alındığından emin olmanız gerekir. Bunu yapmanın bir yolu, "vaadi" diye $http döner faydalanmak için:

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"); 
     } 
    }); 
}); 
+0

Çok teşekkür ederim! – Ilia

+0

Harika cevap! Bunu bloguma ekleyeceğim !! :) –

+0

@ sk8terboi87 ツ Ardından bu oya tıklayın; bu onun için! :) – GFoley83