单张标记单击始终显示最后一个元素

时间:2018-03-19 10:31:51

标签: angular leaflet leaflet.markercluster ngx-leaflet

我正在使用Angular 5和ngx传单,包括标记簇。一切正常,但click函数总是输出列表最后一个元素的名称,而工具提示包含正确的名称。

for (var i  of this.list) {
      var markerItem = L.marker([i.lat, i.lng], {icon})
        .bindTooltip('<h5>'+i.name+'</h5>')
        .on('click', () => {
          console.log(i);
          this.draw(i);
        });
      data.push(markerItem)
    }
    this.markerClusterData = data;

1 个答案:

答案 0 :(得分:2)

你可以改变:

.on('click', () => {
  console.log(i);
  this.draw(i);
}

要:

.on('click', ((i) => () => {
  console.log(i);
})(i))

上面的解决方案使用了闭包。您可以阅读有关他们的更多信息here

您也可以更改

for (var i  of this.list) {

for (let i  of this.list) {

此解决方案使用let keyword

看一下this JSBin,看一个有效的例子。