Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/29.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 谷歌地图信息窗口-(点击)触发角度2函数_Javascript_Angular_Google Maps_Infowindow - Fatal编程技术网

Javascript 谷歌地图信息窗口-(点击)触发角度2函数

Javascript 谷歌地图信息窗口-(点击)触发角度2函数,javascript,angular,google-maps,infowindow,Javascript,Angular,Google Maps,Infowindow,我有一个组件,在Angular 2+应用程序中利用谷歌地图。有没有一种合适的方法可以让一个链接进入标记器的信息窗口,从而触发我的组件中的一个方法?下面的(单击)就是故障点。如果我想创建一个全局方法(希望避免),我可以切换到onclick //如果我们有当前位置,请添加方向 让additionalContent=“”; 如果(此位置标记){ 附加内容=``; } 让infoWindow=new google.maps.infoWindow({ 内容:内容+附加内容 }); google.maps.

我有一个组件,在Angular 2+应用程序中利用谷歌地图。有没有一种合适的方法可以让一个链接进入标记器的信息窗口,从而触发我的组件中的一个方法?下面的
(单击)
就是故障点。如果我想创建一个全局方法(希望避免),我可以切换到
onclick

//如果我们有当前位置,请添加方向
让additionalContent=“”;
如果(此位置标记){
附加内容=`
`; } 让infoWindow=new google.maps.infoWindow({ 内容:内容+附加内容 }); google.maps.event.addListener(标记,'click',()=>{ infoWindow.open(this.map,marker); });
找到了几件可以在没有疯狂的角度开销的情况下完成这项工作的作品。关键在于:

  • 只有一个信息窗口(成员)
  • 将唯一ID添加到定位标记
  • 当信息窗口打开(
    domready
    )时,将单击侦听器添加到已单击的锚的id中
  • 代码如下:

    //Add directions if we have a current location
    let additionalContent = "";
    if (this.positionMarker) {
      additionalContent = `<br><a href='#' id='marker_${markerId}'>Directions</a>`;
    }
    
    //Add the marker listener to open the infowindow
    google.maps.event.addListener(marker, 'click', () => {
      this.infoWindow.setContent(content + additionalContent);
      this.infoWindow.open(this.map, marker);
    
      //Once infow window is open, add a click listener based on the ID in the anchor tag
      if (additionalContent) {
        google.maps.event.addListenerOnce(this.infoWindow, 'domready', () => {
          document.getElementById(`marker_${markerId}`).addEventListener('click', () => {
            this.startNavigating(marker.position.lat(), marker.position.lng());
          });
        });
      }
    });
    
    //如果我们有当前位置,请添加方向
    让additionalContent=“”;
    如果(此位置标记){
    附加内容=`
    `; } //添加标记侦听器以打开信息窗口 google.maps.event.addListener(标记,'click',()=>{ this.infoWindow.setContent(content+additionalContent); this.infoWindow.open(this.map,marker); //打开infow窗口后,根据锚标记中的ID添加单击侦听器 if(附加内容){ google.maps.event.addListenerOnce(this.infoWindow,'domready',()=>{ document.getElementById(`marker_${markerId}`).addEventListener('click',()=>{ 启动导航(marker.position.lat(),marker.position.lng()); }); }); } });
    //Add directions if we have a current location
    let additionalContent = "";
    if (this.positionMarker) {
      additionalContent = `<br><a href='#' id='marker_${markerId}'>Directions</a>`;
    }
    
    //Add the marker listener to open the infowindow
    google.maps.event.addListener(marker, 'click', () => {
      this.infoWindow.setContent(content + additionalContent);
      this.infoWindow.open(this.map, marker);
    
      //Once infow window is open, add a click listener based on the ID in the anchor tag
      if (additionalContent) {
        google.maps.event.addListenerOnce(this.infoWindow, 'domready', () => {
          document.getElementById(`marker_${markerId}`).addEventListener('click', () => {
            this.startNavigating(marker.position.lat(), marker.position.lng());
          });
        });
      }
    });