Связывание данных о событиях щелчка Leafletjs на угловых 4

Question

Я пытаюсь привязать значение из этого события щелчка на листе js map на angular 4. Но он не дает доступа к связанным переменным. Я хочу обновить эти связанные переменные при клике. Пожалуйста, помогите мне найти способ доступа к этим связанным значениям.

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" внутри этой функции.

Answer 1

Я сомневаюсь, правильно ли я понял ваш вопрос. Но я думаю, может быть, это то, что вы ищете.

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();

    });

  }

}