Question

我正在尝试在角度4应用程序中实现一个地图（使用openlayers）。我已经这样实现了它： HTML：

<div id="map" class="map" style="width:80vw;height: 60vh;"></div>

打字稿：
声明：

@ViewChild("mapElement") mapElement:ElementRef;
public map:any;

初始化：

this.map = new ol.Map({
        layers: [
            new ol.layer.Tile({
                source: new ol.source.OSM()
            })
        ],
        target: 'map',
        view: new ol.View({
            center: [2905830.0672892607,5532192.9828046],
            zoom: 12
        })
    });

在我的ts文件中，我还有selectedLat和selectedLon（类型为any的变量）。我想根据用户点击地图触发的事件中找到的坐标来设置这些变量。为此我做了这个尝试了以下内容：

this.map.on('click',this.some_function);

Some_function：

some_function(evt) {
    this.selectedLon=ol.proj.toLonLat(evt.coordinate)[0];
    this.selectedLat=ol.proj.toLonLat(evt.coordinate)[1];
}

我遇到的问题是这个（在some_function中）由地图表示，而不是我的原始组件。有没有办法让我把原来的这个元素传递给some_function？

我也试过但失败了：

this.map.on('click',{param1:this},this.some_function);

感谢您的帮助：）

Answer 1

正如Openlayers documents所说，map.on可以有三个参数。一个是事件类型，另一个是监听器函数，最后一个是你想要用作的可选对象。

因此您可能需要使用this.map.on('click', this.som_function, this)

Answer 2

将数据绑定到此。

this.some_function = function(e){
    //this.foo
}

var data={foo:1};
this.some_function = this.some_function.bind(data);
this.map.on('click',this.some_function);

在地图上的点击处理程序中传递此内容

2 个答案: