无法使用角度 2 在谷歌地图的信息窗口中触发点击事件答案

【问题标题】：Unable to trigger click event in infowindow in google maps using angular 2无法使用角度 2 在谷歌地图的信息窗口中触发点击事件
【发布时间】：2018-12-27 04:54:42
【问题描述】：

我正在尝试在谷歌地图的信息窗口中进行点击。我无法使用以下代码实现。谁能告诉我哪里做错了？

loadmap(){
    var locations = [];var map;
     for(var i=0;i<this.data.length; i++){
         locations.push({
             'location_name':this.data[i].location_name,
         });
     }
     var marker; var icon;
     map   = new google.maps.Map(document.getElementById('map'), {
        zoom: 2,
        center: new google.maps.LatLng(40.4637, 3.7492),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    map.markers = [];
    var infowindow = new google.maps.InfoWindow({
       enableEventPropagation: true
    });
     for (var i = 0; i < locations.length; i++) {         
            marker = new google.maps.Marker({
                position: new google.maps.LatLng('lat', 'lng'),
                map: map,
            });              
            google.maps.event.addListener(marker, 'click', (function(marker, i) {          
                return function() {              
                    infowindow.setContent(
                        '<span>'+locations[i].location_name+'</span><br/>'+
                        '<input type="button" id="infowindow_submit" name="submit" value ="submit"/>'
                    );
                    infowindow.open(map, marker);
               };
            })(marker, i));
            google.maps.event.addListener(infowindow, 'domready', function() {
                $("#infowindow_submit").submit(function() {
                    console.log("hi!");
                });
            });
    }
}

【问题讨论】：

大部分看起来并不像 Angular 代码...infowindow 定义在哪里？您是否正在为仅使用纯 JS 事件处理程序发生任何事情而苦苦挣扎，或者难以将其集成到 Angular 中。我想可能有谷歌地图 npm 包可以更好地与 Angular 集成，尽管我没有看过。您是否收到任何控制台错误？你能在点击处理程序中放置一个断点或console.log，看看该代码是否正在执行？
我正在使用纯 JS 代码在我的 Angular 项目中显示地图。我在控制台中没有收到任何错误，当我单击 infoWindow 中的按钮时也没有发生任何事情。正在执行标记的单击处理程序，但不是 infowindow domready 部分。那部分也没有被调试
我认为您的问题可能是 infowindow 未定义。你还有代码吗？ stackoverflow.com/questions/5416160/… 中的答案似乎创建了一个名为 that 的变量。
@ScottyWaggoner 我已经更新了我的代码...定义了 infoWindow 但问题仍然存在

标签： javascript jquery google-maps google-maps-api-3 infowindow

【解决方案1】：

我认为您的问题是您正在使用按钮但尝试添加表单事件侦听器。

$("#infowindow_submit").submit(() => console.log("hi!")) 适用于表单，但不适用于单个按钮。

你在找$("#infowindow_submit").click(() => console.log("hi!"))吗？

我相信您的评论可能是矛盾的，这就是导致我注意到上述问题的原因。

当我单击 infoWindow 中的按钮时，什么都没有发生。点击标记的处理程序正在执行，但不是信息窗口 domready 部分

如果您单击信息窗口中的按钮，domready 事件应该已经触发。我以为您根本无法打开信息窗口。猜猜我第一次没看错……你那里没有console.log，也没有说你试图在那里设置断点。您拥有的console.log 在submit 事件中，但在domready 事件函数中没有。希望domready 真的被解雇了。

【讨论】：

嘿，谢谢。这是我这边的一个错误。它现在正在工作。你说得对。我应该使用点击