【问题标题】:Google Maps Javascript API: TypeError: response.data[0].geometry.location.lat is not a functionGoogle Maps Javascript API:TypeError:response.data[0].geometry.location.lat 不是函数
【发布时间】:2016-10-14 23:15:47
【问题描述】:

我成功地从 Google Map Javascript Api 获得答案并尝试访问 google.maps.GeocoderResult 的值以从 GeocoderGeometry / LatLng 中提取纬度和经度

我按照 TSD 定义实现了 response.data[0].geometry.location.lat(),这导致在 Chrome 中调试时出现错误:

  TypeError: response.data[0].geometry.location.lat is not a function

查看调试器中的对象,有效地表明不支持任何方法 lat() 或 lng()。

我可以访问 response.data[0].geometry.location.lat 以成功获取调试器中的值,但是我的代码不再符合 Typescript。

我当然可以转换结果,但仍然想了解原因。此外,也许有人得到了解决方案的解释和建议?

最好的问候

作为记录,打字稿定义:

https://github.com/DefinitelyTyped/DefinitelyTyped/blob/0e139d5d4681b71d53a30408efcc64b79eed6354/googlemaps/google.maps.d.ts

使用 chrome 调试信息更新:

response.data[0].geometry.location.lat() => <not available>
response.data[0].geometry.location.lat: 47.37793800000001

response.data[0].geometry.location: Object
  lat: 47.37793800000001
  lng: 8.5401898

 response.data[0].geometry: Object
    location:Object
      lat:47.377
      lng: 8.5401898

错误的堆栈跟踪:

TypeError: response.data[0].geometry.location.lat is not a function
at interestsParamsCtrl.js:61
at processQueue (ionic.bundle.js:29127)
at ionic.bundle.js:29143
at Scope.$eval (ionic.bundle.js:30395)
at Scope.$digest (ionic.bundle.js:30211)
at Scope.$apply (ionic.bundle.js:30503)
at done (ionic.bundle.js:24824)
at completeRequest (ionic.bundle.js:25022)
at XMLHttpRequest.requestLoaded (ionic.bundle.js:24963)

更新 2:要查询 API,我执行 GET 并解析响应

search(searchLocationTerm:string):ng.IPromise<{}> {
  var deferred = this.$q.defer();

  this.$http.get(Resources.Constants.Default.GOOGLE.API.URL,
    {
      params: {
        address: searchLocationTerm,
        key: Resources.Constants.Default.GOOGLE.API.KEY
      }
    })
    .success((response:Communication.IGeocoder) => {
      deferred.resolve(response);
    }).error((response:Communication.IGeocoder) => {
      deferred.reject(response);
  });

  return deferred.promise;
};

IGeocoder 在哪里

export interface IGeocoder {
  results:google.maps.GeocoderResult[];
  status:google.maps.GeocoderStatus;
}

【问题讨论】:

  • 修复 Typescript 定义并发送拉取请求?
  • 可以试一试,但我有效地阅读了 response.data[0].geometry.location.lat() 应该使用,这就是为什么我想弄清楚为什么在调试时会发生该错误
  • 如果输出到控制台,response.data[0].geometry.location 是什么?
  • 当我使用 LatLngLiteral 而不是 LatLng 对象时,我曾经有过类似的错误消息。也许你的错误也是因为这个。
  • 谢谢,这是一个很好的提示。我更新了我的问题的详细信息。如您所见,我没有操纵答案。我做了一个获取,然后响应是解析器。这意味着响应被错误地解析为 LatLngLiteral 而不是 LatLng?还是说 TSD 定义有误,在这种情况下应该在哪里使用 LatLngLiteral 而不是 LatLng?

标签: google-maps google-maps-api-3 google-geocoder


【解决方案1】:

您正在通过 AJAX 发送 Web 服务请求。请注意,Web 服务 Geocoding API 的响应是文档中指定的 JSON 对象:

https://developers.google.com/maps/documentation/geocoding/intro?hl=en#GeocodingResponses

您应该使用客户端地理编码服务来获取符合 google.maps.d.ts 中定义的对象

看看这个example和客户端geocoder service documentation

【讨论】:

  • 谢谢。因此,如果我理解正确,这意味着我“滥用”了 google.maps.d.ts 打字稿定义,因为该定义描述了服务对象(“with methods”),其中我的 http get“仅”返回 JSON 对象(“没有方法”)。所以在我的情况下,我应该编写自己的 tsd 定义文件对吗?
  • P.S.:举个例子,谢谢,但我的客户端没有“地图”,它是关于自动完成组件的。在那种情况下,我认为我应该以 http.get 的方式使用该服务
  • 正确,如果你查看 google.maps.d.ts 的源代码,你会看到第一行是Type definitions for Google Maps JavaScript API 3.20。您不使用 Maps JavaScript API,您使用 Geocoding API,因此此定义文件不适用。您是实现自己的自动完成功能还是使用 Maps JavaScript API 的自动完成小部件?
  • 非常感谢您的确认,现在完全明白了。我会将您的答案标记为好的答案。不是我自己的自动完成功能,我在堆栈溢出方面遵循了一些教程和解决方案。
猜你喜欢
  • 1970-01-01
  • 2012-06-09
  • 2016-08-10
  • 2020-10-21
  • 2018-01-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多