Angular 有角度的传单弹出窗口点击不工作？

我已经在angular 6应用程序中实现了@asymmetrik/ngx传单，除了弹出窗口外，其他一切都正常。在我在地图上显示了一些标记后，其显示如图所示：

我想在用户单击按钮时更改路由，但是由于单击事件中的（click）事件不是trigger，我在onClick中实现了内联函数javascript，并在单击弹出窗口之前调用它，就像地图上有标记一样！所以它不起作用。代码如下：

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]);
      //   })
      // })
    )};
  });

this.listOfStations.map（station=>{
if（对象键（站位置）.length>0）{
this.markers.push（marker（[station.location.coordinates[0]，station.location.coordinates[1]）{
图标：图标({
iconSize:[25,41]，
iconAnchor:[13,41]，
iconUrl:'assets/marker icon.png'，
shadowUrl:“资产/标记shadow.png”
})
})
.bindPopup(`
站：${Station.stationCode}
${station.description}
看法
`)
//.on（'点击'，（e）=>{
//此.zone.run（（）=>{
//这个.router.navigate（['/dashboard/station/'+station.stationCode]）；
//   })
// })
)};
});

---

谢谢。

我为我正在开发的一个应用程序做了一个类似的东西，并让它像这样工作：

.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);
}

.bind弹出窗口(`
${markerinfo.partnerName}
${markerinfo.partnerAddress}
${markerinfo.descText}
`).addTo（地图）
.on（'popupopen'，函数（）{
self.elementRef.nativeElement.querySelector（“.partner link”）
.addEventListener（'单击'，（e）=>{
const partnerId=e.target.getAttribute（'data-partnerId'）；
self.showPartner（partnerId）；
});
})
showPartner（partnerId）{
//this.router.navigate（['/app/partners'+'/'+partnerId]）；
log（'转到合作伙伴：'+partnerId）；
}

角度9的答案：

export class MapComponent implements OnInit {

...

//whenever we do click, if element clicked has class "goOrigin" then execute this.goOrigin
  @HostListener('document:click', ['$event']) 
  clickout(event) 
  { 
    if(event.target.classList.contains("goOrigin"))
      this.goOrigin(); 
  }

...

//Just bind a text to your marker
let text: string = "<a href='#' class='goOrigin'>Usar de origen ></a>";
this.markerPoint = L.marker([latitude, longitude]);
this.markerPoint.addTo(this.map).bindPopup(text);

...

  goOrigin()
  {
    console.log('origen');
  }

导出类MapComponent实现OnInit{
...
//无论何时单击，若单击的元素具有类“goOrigin”，则执行this.goOrigin
@HostListener（'文档：单击'，['$event']））
点击（事件）
{ 
if（event.target.classList.contains（“goOrigin”））
这个；
}
...
//只需将文本绑定到标记
let text:string=“”；
this.markerPoint=L.marker（[纬度，经度]）；
this.markerPoint.addTo（this.map）.bindpoop（text）；
...
古里金（）
{
console.log（'origen'）；
}

资料来源：