agm-marker's markerClick() 返回 null

Question

来自Angular Google Maps api，我们有一个MarkerClick((函数，具有以下定义，

 @Output() markerClick: EventEmitter<void> = new EventEmitter<void>();

但是当我在应用程序中使用时，我会得到 null 。

我有以下应用程序的代码，

在我的html文件中，

<agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="zoom">
        <agm-marker *ngFor="let marker of coordinates;" 
        [iconUrl]="icon" 
        [latitude]="marker.latitude" 
        [longitude]="marker.longitude"
        [markerClickable]="true"
        (markerClick)="markerClicked($event)">
    </agm-marker>
    </agm-map>

和.ts文件，

 markerClicked($event: MouseEvent) {
    console.log('clicked'); ----------------(1)
    console.log($event);--------------------(2)
  }

对于语句(2(，我将无效作为控制台输出。我希望它是标记对象。我的理解错了吗？如何从MarkerClick((函数中获取LAT和LNG。

注意，我已经在使用 mapClick(( agm-map tag 是否没有响应地图上已经绘制的标记的点击。

Answer 1

如果您查看 file 更深层次，它总是会发出null：

this.markerClick.emit(null); // line no : 192

---

您可以做的就是更改此信息：

(markerClick)="markerClicked($event)"

to：

(markerClick)="markerClicked(marker)" // this way you will get the marker object

工作演示(单击任何可用标记(

Answer 2

在app.component.html

中

<agm-map>
<agm-marker  *ngFor="let place of markers" [latitude]=place.lat [longitude]=place.lng  title={{place.title}}  (markerClick)="clickedMarker(place.lat, place.lng)" >
<agm-info-window><strong>{{place.label}}</strong></agm-info-window>
</agm-marker>
</agm-map>

在app.components.ts

中

markers: any[] = [];
selectedLat: Number = 0;
selectedLng: Number = 0;
clickedMarker(lat: number, lng: number) {
this.selectedLat = lat;
this.selectedLng = lng;
}

在这里单击标记时，它调用clickedMarker(lat: number, lng: number)功能。在其中，SelectedLat和SelectedLNG变量从(markerClick)="clickedMarker(place.lat, place.lng)

的发送参数更新

不用以这种方式使用(markerClick)="markerClicked($event)"