javascript - Angular Google map - map 信息窗口

Question

我正在开发一个 Angular 应用程序，我在其中实现了 Angular Google map (angular-maps.com)。当我点击 map 上的一个地方时，它会打开谷歌地图的标准信息窗口。我需要用我的应用程序的一些按钮用自定义信息窗口替换这个标准信息窗口。我不知道如何在 Angular 和 Angular 谷歌地图中执行此操作。有谁知道如何操作这个标准信息窗口，防止它打开和收集上面的所有信息，并将其放入自定义信息窗口中？

我试图在 ngZone 中实现 javascript，以在 Angular 之外运行它，但没有成功，我试图从 Angular 映射中的一些预构建指令中查找，但我找不到它

这是初始化 map 的代码:

 ngOnInit() {
this.mapsAPILoader.load().then(
  () => {
    const autocomplete = new google.maps.places.Autocomplete(this.searchElement.nativeElement, {types: ['establishment'] });
    autocomplete.addListener('place_changed', () => {
      this.ngZone.run(() => {
        const place: google.maps.places.PlaceResult = autocomplete.getPlace();
        if (place.geometry === undefined || place.geometry === null) { return; } else {
          const poi: Poi = {
            uid: place.place_id,
            title: place.name,
            coords: {lat: place.geometry.location.lat(), lng: place.geometry.location.lng()},
            draggable: false,
        };
          this.temporaryMarker(poi);
        }
      });
    } );
  }
);

}

这是我处理 Angular 谷歌地图的“mapClick”的函数:

 mapClicked(e: MouseEvent) {
console.log('mapClicked()=>', e);
if (e.placeId) {
  this.getPlaceDetails(e.placeId).subscribe(place => this.openInfoWindow(place));
}
this.clickedLat = e.coords.lat;
this.clickedLng = e.coords.lng;
this.infoWindowIsOpen = true;
const preventInfoWindow = // HERE IS WHERE I SUPPOSE THAT SHOULD HAVE MY CODE
// service.getDetails(request, this.openInfoWindow(place, status));
  }

直到现在，任何 MARKER 单击我都可以操纵其信息窗口，但这很容易。我不能做的是从谷歌地图上的地方操纵信息窗口，谷歌地图向您显示的标准兴趣点。我的 UI 上必须有它们，但我需要处理它们的信息，防止标准信息窗口打开，并打开自定义信息窗口。

Answer 1

先看这个: https://angular-maps.com/api-docs/agm-core/components/agmmap#showDefaultInfoWindow

你想做的是

<agm-map [showDefaultInfoWindow]="false" (click)="mapClicked($event)">

那么默认窗口不会打开，您可以显示自己的信息窗口。