角度地理编码结果不同步

Angular geocoding results not synchronous

本文关键字：结果 同步 编码      更新时间：2023-09-26

我正试图使用谷歌地理编码作为我可能正在开发的功能的POC，但我遇到了问题。

基本上，它从用户在搜索输入中键入地址开始，地理编码服务返回地址列表，因为不同的地址可能出现在不同的位置，或者如果用户拼写错误，那么用户可以选择正确的地址。

所以第一步搜索(角度控制器(：

$scope.submit = function(addressform) {
      $scope.addresses = geocoder.getAddressList($scope.formData.address);
}

Geocoder是一个内部工厂，使用谷歌地图和谷歌地理编码。这是一个与此示例相关的地理编码：

app.factory('geocoder', function(GoogleMap) {
  var geocoder = new google.maps.Geocoder(),
  return {
    getAddressList: function(address) {
      geocoder.geocode( { 'address': address }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          return results;
        } else {
          alert("Couldn't find that address! Google Maps says: " + status);
        }
      });
    }
  }
});

这是视图部分：

<ul>
  <li ng-repeat='address in addresses'>
    <a ng-click='displayOnMap()'>{{address.place_id}}</a>
  </li>
</ul>

这应该将地理编码结果写入视图中。我遇到的问题是，调用地理编码器方法execute的控制器会立即返回，但在那之后的一段时间，地理编码器实际上会返回结果。

我如何让angular控制器等待，直到geocoder真正调用return语句并返回结果，这样我就可以更新我的html了？

您将无法回避geocoder.geocode是异步的这一事实。

您有两个选项：第一个选项是将回调传递给getAddressList，并在成功时调用回调。一个更有角度的方法是使用$q服务。

getAddressList: function(address) {
  var deferred = $q.defer();
  geocoder.geocode( { 'address': address }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      deferred.resolve(results);
    } else {
      deferred.reject("Couldn't find that address! Google Maps says: " + status);
    }
  });
  return deferred.promise;
}

控制器也需要更换：

$scope.submit = function(addressform) {
  geocoder.getAddressList($scope.formData.address).then(function(result) {
    $scope.addresses = result;
  }, function(err) {
    alert(err);
  });
}

不要从服务中拨打提醒电话。这是一个UI问题。

相关文章：