以角度返回链接承诺的“最后”值

Question

我试图做一些地理定位并基于坐标，调用返回一些数据的RESTful API。然后我想解析这些数据，最后返回它 我对angular.js和promises很新，因此这段代码是我通过互联网看到的一些东西：D

我已经使所有工作，但我错过了最后一步：返回处理结果数组（“allSpots”）到原来的调用者。我在这里错过了什么？

.factory('wifiSpotFactory', function (WifinderModel, $q, $http) { 

      function onGeolocationSuccess(position) { 

      var url = 'http://localhost:34915/api/spots?latitude=' + position.coords.longitude + '&longitude=' + position.coords.latitude; 

      $http.get(url).then(function (response) { 

       var allSpots = [], data = response.data; 
       for (var i = 0; i < data.length; i++) { 
        var newSpot = new WifinderModel.wifiSpot(data[i].id, data[i].name, data[i].password, data[i].address); 
        allSpots.push(newSpot); 
       } 

       return allSpots; 

      }, function (error) { 
       console.log(error); 
      }); 

     }; 

      var wifiSpotFactory = { 
       loadNearSpots: function() { 
       var geo_options = { 
        enableHighAccuracy: true, 
        maximumAge: 50000, 
        timeout: 30000 
       }; 

       var deferred = $q.defer(); 

       navigator.geolocation.getCurrentPosition(deferred.resolve, deferred.reject, geo_options); 

       return deferred.promise 
         .then(onGeolocationSuccess) 
         .then(function(allSpots) { return allSpots; }); 
      } 
      }; 
      return wifiSpotFactory; 
      }) 

然后在控制器中，我该如何检索promise的值？

.controller('wifiListController', [ 
       '$scope', 'wifiSpotFactory', function ($scope, wifiSpotFactory) { 
        $scope.spots = wifiSpotFactory.loadNearSpots(); 
       } 
]) 

Answer 1

Callback不必返回数据的能力，你应该使用承诺模式那里有能力从诺言中返回数据。你onGeolocationSuccess正在使用回调模式，似乎return data但实际上它不。

您可以通过返回onGeolocationSuccess方法中的承诺来解决问题，因为您需要返回$http.get对象，该对象已经返回承诺对象。在该函数的.then中，您将获得从API返回的data。从.then函数您可以返回data，这将帮助您遵循promise pattern。

代码

.factory('wifiSpotFactory', function(WifinderModel, $q, $http) { 

    function onGeolocationSuccess(position) { 
    var url = 'http://localhost:34915/api/spots?latitude=' + position.coords.longitude + '&longitude=' + position.coords.latitude; 

    return $http.get(url). 
    then(function(response) { 
     var allSpots = [], 
      data = response.data; 
     for (var i = 0; i < data.length; i++) { 
     var newSpot = new WifinderModel.wifiSpot(data[i].id, data[i].name, data[i].password, data[i].address); 
     allSpots.push(newSpot); 
     } 
     return allSpots; 

    }, function(error) { 
     console.log(error) 
    }); 
    }; 

    var wifiSpotFactory = { 
    loadNearSpots: function() { 
     //..other code as is..to make solution cleaner removed that part. 
     //return promise to follow promise chain 
     return deferred.promise 
     .then(onGeolocationSuccess) 
     .then(function(allSpots) { 
     return allSpots; 
     }); 
    } 
    }; 
    return wifiSpotFactory; 
}) 

控制器

.controller('wifiListController', ['$scope', 'wifiSpotFactory', 
    function ($scope, wifiSpotFactory) { 
     wifiSpotFactory.loadNearSpots().then(function(data){ 
      $scope.spots = data; //data will be available inside `.then` which promise resolve/reject 
     }); 
    } 
]) 

Answer 2

返回的链接承诺：

function onGeolocationSuccess(position) { 
    var url = 'http://localhost:34915/api/spots?latitude=' + position.coords.longitude + '&longitude=' + position.coords.latitude; 

    return $http.get(url).success(function(data, status, headers, config) { 
    var allSpots = []; 
    for (var i = 0; i < data.length; i++) { 
     var newSpot = new WifinderModel.wifiSpot(data[i].id, data[i].name, data[i].password, data[i].address); 
     allSpots.push(newSpot); 
    } 

    return allSpots; 

    }).error(function(data, status, headers, config) {}); 
}; 

接着，电话可以是：

deferred.promise 
.then(onGeolocationSuccess) 
.then(function(allSpots) { ... });