$ http后空角度工厂数据为空

时间:2014-08-18 12:53:49

标签: angularjs

我正在尝试通过http请求方法将数据存储到location []数组中,直到json文件。

问题是我的列表控制器总是包含一个空数组。

我的工厂

app.factory('listing__data', function($http, $q){
  return {
    locations: '',
    makeRequest: function(url) {
      // Create the deffered object
      var deferred = $q.defer();

      $http.get('/'+url).then(function(resp) {
        deferred.resolve(resp.data);
      });
      return deferred.promise;
    },
    getUrl: function(params) {
      var url = "locations.json";

      if(!this.locations) {
        this.locations = this.makeRequest(url);
      }
      // Return the myObject stored on the service
      return this.locations;
    }
  };
});

我的控制器

var listings__controller = app.controller('listings__controller', function($scope, distance__service, listing__data) {
    $scope.locations = [];

    listing__data.getUrl(distance__service.meters).then(function(data) {
    $.each(data.listings, function(i, item) {
          $scope.locations.push(item.location);
          console.log(item.location); // ** Shows Correct Object **
        });
    });
    console.log("How many inside:"+$scope.locations.length); // ** Empty - Shows 0 **
});

我似乎无法弄清楚为什么$scope.locations = []仍为空

1 个答案:

答案 0 :(得分:2)

即使没有JB Nizet提到的拼写错误,你仍会看到0,因为console.log("How many inside:"+$scope.locations.length);在之前被执行传递给listing__data.getUrl(distance__service.meters).then的回调,因为后者是异步的。

请记住,在使用异步函数时,执行流程并不遵循源代码行的顺序。

promise.then(function () {
    console.log('inside callback');
});
console.log('outside callback');

将打印outside callback 然后 inside callback

因此,如果您要使用$scope.locations中存储的值,则必须在里面进行回调。