让传单标记单击事件与 Angular 2 一起使用答案

【问题标题】：Getting Leaflet marker click event to work with Angular 2让传单标记单击事件与 Angular 2 一起使用
【发布时间】：2017-04-01 05:41:10
【问题描述】：

在 Angular2 应用程序上显示传单时，点击绑定到标记不会在鼠标点击时触发。

  let el = this._elementRef.nativeElement.querySelector('.leaflet-maps');
  L.Icon.Default.imagePath = 'assets/img/theme/vendor/leaflet';

  this.map = new L.Map('map', {
    center: new L.LatLng(26.166314, -81.706957), zoom: 15});
  var osm=   L.tileLayer('http://ip/{z}/{x}/{y}.png',  { maxZoom: 18 }).addTo(this.map);
  var d= L.marker([26.166314, -81.706957], { icon: this.icons.online, clickable: true }).on('click',
    (data) => {
      alert("I have a click.")
    } ).addTo(this.map)

我可以在地图上添加一个点击事件，它工作正常，但标记上的点击事件似乎不起作用。

【问题讨论】：

标签： angular leaflet

【解决方案1】：

确保用于实例化标记的代码正确，尤其是图标this.icons.online。

删除图标后，一切都会按预期进行：https://plnkr.co/edit/NdKpe8BeoidYQCnxBsKS?p=preview

【讨论】：