Question

我正在使用angular google maps，并且当鼠标悬停在标记上时，我试图显示标记信息窗口。

查看

<agm-marker *ngFor="let p of people" 
[iconUrl]="'/assets/user.png'" 
[latitude]="p.lat" [longitude]="p.lng"
(markerClick)="onMarkerClick(p)"  
(mouseOver)="showInfo(p)"  (mouseOut)="hideInfo(p)">
  <agm-info-window *ngIf="show">
    <div>Hello! {{p.nome}}</div>
  </agm-info-window>
</agm-marker>

组件

showInfo(p: Person){
    this.show = true;
    console.log(this.show);

  }

  hideInfo(p: Person){
    this.show = false;
    console.log(this.show);    
  }

我知道事件已正确触发，因为日志正确，但信息窗口从不显示。我究竟做错了什么？谢谢。

Answer 1

agm-info-window提供了用于显示和隐藏信息窗口的选项[isOpen]。将show属性与[isOpen]绑定以获得所需的结果。

<agm-info-window [isOpen]="show">
   <div>Hello! {{p.nome}}</div>
</agm-info-window>

Answer 2

<agm-info-window [isOpen]="show">
   <div>Hello! {{p.nome}}</div>
</agm-info-window>

在agm-info-window [isOpen] =“ show”中，其中show是一个布尔值，您可以将它与mouseOver函数中的true或false一起使用。

有角度的谷歌地图显示鼠标悬停的信息窗口

2 个答案: