Событие прослушивателя умножает результат

Question

Я хочу получить текущие координаты щелкнутой точки на Картах Google.

Мой код:

let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 


getCoords() { 
    google.maps.event.addListener(this.map, 'click', (event) => { 
     console.log(event.latLng); 
    }); 

Связывание с Google Maps:

<div #map id="map" (click)="getCoords()"> </div> 

Что я получаю по щелчку на карте есть:

• 1 щелчок: ничего не происходит
• 2 клика: текущие координаты
• 3 нажмите: текущие координаты х 3
• 4 нажмите: текущие координаты х 5
• т.д.

Как превратить свою функцию ожидаемого поведения?

Answer 1

Проблема заключается в том, что, поскольку вы связываете getCoords для события click в HTML, вы вызываете google.maps.event.addListener каждый раз, когда вы нажимаете на карту. Попробуйте удалить обработчик щелчка от HTML: <div #map id="map"> </div>

Позвони google.maps.event.addListener где-то в инициализации, поэтому слушатель событий будет создаваться только один раз.