Angular Google 地图：无法从点击事件对象获取 LatLng

Question

在我的应用程序中，单击 google 地图后，我需要获取纬度和经度信息以进行进一步处理。由于应用程序使用 angularJs 作为框架，我使用 Angular Google 地图库来制作地图。我的代码如下：

$scope.map = {
        center: {
           latitude: 37.782551,
           longitude: -122.445368
        },
        zoom: 12,
        heatLayerCallback: function (layer) {
           MockHeatLayer(layer);
        },
        showHeat: true,
        // the issue is from here
        onclick: {
            click : function(maps, event, arguments) {
                console.log(event.latLng); //return undefined 
                console.log(typeof(event)); //return string type instead of event object 
            }
        }
};

和HTML标签如下：

<ui-gmap-google-map center='map.center' zoom='map.zoom' events='map.onclick'>
    <ui-gmap-layer namespace="visualization" type="HeatmapLayer" show="map.showHeat" onCreated="map.heatLayerCallback"></ui-gmap-layer>
</ui-gmap-google-map>

如您所见，我在 map 数组中将 events 设置为 onclick。
但是经过调试，handle函数中的event是字符串而不是对象，请问是什么问题呢？

Answer 1

根据文档，第二个参数是 eventName 应该是字符串，因为事件对象在第三个参数中。来自 docs:

The handler function takes three parameters: 1. maps: the GoogleMap 2. object eventName: the name of the event 3. arguments: the arguments provided by Google Maps for this event type.

因此，在您的代码中不要使用 onclick: { ...，而是使用：

events: {
     click : function(maps, eventName, arguments) {
          var e = arguments[0];
          var lat = e.latLng.lat(), lng = e.latLng.lng();
          console.log("my lat is:" + lat + ", lng is:" + lng);
     }
}

更新 events 数组也可以命名为 onclick，具体取决于您要处理的事件类型。