angular - 用 Angular Map @agm 关闭之前的 infoWindow

Question

我在问一个很多人问的问题，但没有人给出明确的答案，几乎是在 AGM (Angular 2 package for Google map) 上

这是我的代码，但是我第一个打开的标记不想关闭，其他标记一半时间关闭

clickedMarker(marker: Marker, infoWindow, index: number) {

   if (this.infoWindow && this.infoWindow !== infoWindow) {
      this.infoWindow.close();
    }
    this.infoWindow = infoWindow;
}

谁能帮我解决这个关闭问题，使用关闭功能或事件发射器 https://angular-maps.com/api-docs/agm-core/components/AgmInfoWindow.html#source

感谢您的宝贵时间和帮助；)

编辑:找到答案

我有我的 <agm-info-window #infoWindow>使用 <a *ngIf="myCondition"..>{{address}}</a> 显示多个信息但当条件再次评估为真时，它似乎没有呈现弹出窗口。

我用<a [class.hidden]="!myCondition">..</a>代替了它并修复了标记的多重显示。

另一个好的做法是点击 map 时关闭，打开时关闭:

clickedMap($event) {
   if (this.infoWindow) {
      this.infoWindow.close();
   }
}

它可能在未来有所帮助......谁知道呢？

Answer 1

经过长时间的研究和不明确的解决方案，终于找到了一个很好的解决方案，可以在打开新窗口时清除以前的 agm-info-window

这是我的 component.html:

 <agm-map (mapClick)="close_window($event)" [fullscreenControl]='true' [mapTypeControl]='true' [latitude]="lat" [longitude]="lng" [zoom]="13" [scrollwheel]="false">
     <div *ngFor="let data of zonas">
        <agm-marker (markerClick)=select_marker(infoWindow) [latitude]="data.latitud" [longitude]="data.longitud">
           <agm-info-window #infoWindow >            
           </agm-info-window>
         </agm-marker>
      </div>
  </agm-map>

这是我的 component.ts:

constructor(public apiService: ApiService) {}
infoWindowOpened = null
previous_info_window = null
...
close_window(){
if (this.previous_info_window != null ) {
  this.previous_info_window.close()
  }    
}

select_marker(data,infoWindow){
 if (this.previous_info_window == null)
  this.previous_info_window = infoWindow;
 else{
  this.infoWindowOpened = infoWindow
  this.previous_info_window.close()
 }
 this.previous_info_window = infoWindow
}

所以每次打开一个新窗口时，它都会检测事件并关闭前一个窗口，如果用户在 map 的任何其他部分的窗口外单击，这也适用于关闭打开的窗口