Angular 服务中的回调 - 如何将数据返回到控制器

Question

我正在使用 Google Maps API 来获取两点之间的距离。此方法使用回调函数。问题是这段代码位于 Angular 服务中，我想从控制器调用它，以便控制器可以在范围内输出结果。但我不知道该服务如何将生成的 hospitals[] 对象数组返回给控制器。我怎样才能做到这一点？

myAppServices.service('NearestHospitalService', function(){
function calculateDistances() {
        var service = new google.maps.DistanceMatrixService();
        var hospitals = [];
        service.getDistanceMatrix(
        {
          origins: [origin1],
          destinations: [destinationA, destinationB],
          travelMode: google.maps.TravelMode.DRIVING,
          unitSystem: google.maps.UnitSystem.METRIC,
          avoidHighways: false,
          avoidTolls: false
        }, callback);

    }

function callback(response, status) {
        if (status != google.maps.DistanceMatrixStatus.OK) {
            alert('Error was: ' + status);
        } 
        else {
            var origins = response.originAddresses;
            var destinations = response.destinationAddresses;
            var results = response.rows[0].elements;
            for (var j = 0; j < results.length; j++) {
                hospitals.push(new hospital(destinations[j], results[j].distance, results[j].duration));
            }
            hospitals.sort(compareDistance);
        }
    }
});

Answer 1

我将添加一些伪代码以使您进入正确的方向。基本上，对于回调，您需要一直回调到您想要使用您的值的位置。

AngularJS 有一个future/promise 模块，也称为$q。我不会使用它，但你应该看看它。

myAppServices.service('NearestHospitalService', function(){
  var api = {};   
  api.calculateDistances = function(callBack) {
    var service = new google.maps.DistanceMatrixService();
    service.getDistanceMatrix(
    {
      origins: [origin1],
      destinations: [destinationA, destinationB],
      travelMode: google.maps.TravelMode.DRIVING,
      unitSystem: google.maps.UnitSystem.METRIC,
      avoidHighways: false,
      avoidTolls: false
    }, extractResult);

    function extractResult(response, status) {
        ... do computations on you response ...
        callback(transformedResponse);
    }
  };

  return api;
});

然后你可以这样称呼它：

$scope.distances = [];
NearestHospitalService.calculateDistances(function( ds ) { $scope.distances = ds; });

如果您的代码中有多个组件需要了解已更新的内容以便提取所需内容，则另一种方法可能是注入 $rootScope 并使用广播。

在这种情况下，您将在服务中缓存响应

myAppServices.service('NearestHospitalService', ['$rootScope', function($rootScope){
  var api = {};
  api.distances = [];   
  api.calculateDistances = function() {
    var service = new google.maps.DistanceMatrixService();
    service.getDistanceMatrix(
    {
      origins: [origin1],
      destinations: [destinationA, destinationB],
      travelMode: google.maps.TravelMode.DRIVING,
      unitSystem: google.maps.UnitSystem.METRIC,
      avoidHighways: false,
      avoidTolls: false
    }, extractResult);

    function extractResult(response, status) {
        ... once again calculate ...
        api.distances = transformedResult;
       $rootScope.$broadcast('updatedDistances'); // you could also send distances as an argument directly if you wanted to.
    }
  };

  return api;
}]);

然后你需要监听广播并获取缓存。

$rootScope.$on('updatedDistances', function(event) { $scope.distances = NearestHospitalService.distances });