Angular Leaflet Popup Click не работает?

Question

Я реализовал @ asymmetrik / ngx-leaflet в своем приложении angular 6, и все работает отлично, кроме всплывающего окна. Это показано, как на картинке после того, как я показал некоторые маркеры на карте: маркер всплывающее

Я хочу изменить маршрут, когда пользователь нажимает кнопку, но с событием (click) от angular, которое не запускается в событии click, я реализовал встроенную функцию javascript в onClick и ее вызов перед тем, как щелкнуть всплывающее окно. столько, сколько на карте есть маркеры! Так что не работает. Код такой:

this.listOfStations.map(station => {
    if(Object.keys(station.location).length > 0){
      this.markers.push(marker([station.location.coordinates[0],station.location.coordinates[1]],{
        icon: icon({
          iconSize: [ 25, 41 ],
          iconAnchor: [ 13, 41 ],
          iconUrl: 'assets/marker-icon.png',
          shadowUrl: 'assets/marker-shadow.png'
       })
      })
      .bindPopup(`
        <div align='center'>
          <p style='font-size:18px;font-weight:bold'>Station: ${station.stationCode}</p>
          <p style='font-size:14px;font-weight:italic'>${station.description}</p>
          <a class='btn btn-xs btn-primary button-me' (click)="${this.consoleThis()}">View</a>
        </div>
      `)
      // .on('click', (e) => {
      //   this.zone.run(() => {
      //     this.router.navigate(['/dashboard/station/' + station.stationCode]);
      //   })
      // })
    )};
  });

Спасибо.

Answer 1

Я сделал похожую вещь для приложения, над которым я работаю, и заставил его работать так:

.bindPopup(`
    <div align='center'>
    <a class="btn btn-primary button-raised partner-link" data-partnerId="${markerinfo.partnerId}">
      ${markerinfo.partnerName}</a>
      <p style='font-size:14px;margin: 5px'>${markerinfo.partnerAddress}</p>
      <img style="height: 100px; width: 170px; margin: 0" src="${markerinfo.descImg}">
      <p style="margin:5px;font-style:italic">${markerinfo.descText}</p>
    </div>
  `).addTo(map)
          .on('popupopen', function () {
            self.elementRef.nativeElement.querySelector('.partner-link')
              .addEventListener('click', (e) => {
                const partnerId = e.target.getAttribute('data-partnerId');
                self.showPartner(partnerId);
              });
          })

showPartner(partnerId) {
// this.router.navigate(['/app/partners' + '/' + partnerId]);
console.log('going to partner: ' + partnerId);
}