首页 > 解决方案 > Leafletjs单击角度4上的事件数据绑定

问题描述

我正在尝试在角度 4 上的传单 js 映射中的 click 事件中绑定一个值。但是,它没有提供对绑定变量的访问权限。我想在点击事件上更新那些绑定变量。请帮助我找到访问这些绑定值的方法。

export class ViewLocationsComponent implements OnInit {

 long = '';
  lati = '';//These values needed to be accessed
 ngOnInit() {
    this.loadAllLocations();
    this.update();
  }

update(): void{
    const map = L.map('map').setView([51.505, -0.09], 13);
    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
      attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
    }).addTo(map);

    map.on('click', function (e){

      var lati = e.latlng.lat;
      var long = e.latlng.lng;//These are the values needed to be bind
      alert(lati+"  "+long);
       var marker = new L.marker([e.latlng.lat,e.latlng.lng]).addTo(map);

      marker.bindPopup("marker").openPopup();

    });

  }

}

它不支持此函数内的“this”关键字。

标签: angularmongodbleafletmouseevent

解决方案


我怀疑我是否正确理解了你的问题。但我想也许这就是你要找的。

export class ViewLocationsComponent implements OnInit {

    long = 0;   lati = 0; //These values needed to be accessed  ngOnInit() {
    this.loadAllLocations();
    this.update();   }

update(): void{
    const map = L.map('map').setView([51.505, -0.09], 13);
    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
      attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
    }).addTo(map);

    map.on('click', e=>{

      this.lati = e.latlng.lat;
      this.long = e.latlng.lng;//These are the values needed to be bind
      alert(lati+"  "+long);
       var marker = new L.marker([e.latlng.lat,e.latlng.lng]).addTo(map);

      marker.bindPopup("marker").openPopup();

    });

  }

}

推荐阅读