OpenLayers - LayerSwitcher 更改可见性

Question

我正在开发一个基于 Angular 的应用程序，它使用 OpenLayers 在地图上显示给定的数据。

对于这张地图，我使用的是 LayerSwitcher (ol-ext.control.LayerSwitcher)：

const layerSwitcher = new LayerSwitcher({
        tipLabel: 'Layers',
        trash: false,
        width: 800
    });
this.map.addControl(layerSwitcher);

我还有一个 LayerGroup，我正在向其中动态添加矢量图层。所有这些图层都可以通过 LayerSwitcher 逐一选择/取消选择，也可以通过勾选整个 LayerGroup 的复选框来选择/取消选择。

我希望具有这样的功能：当在 LAyerSwitcher 中单击一个矢量图层以选择/取消选择（带有标记的红色圆圈）时，我想对我的地图对象执行一些操作。 我添加了一个用于可见性更改事件的监听器：

const vectorLayer = this.myFunctionToGetTheLayer(input1, input2);
vectorLayer.on('change:visible', function () {
    console.log('selected')
});
this.layerGroup.getLayers().push(vectorLayer);

这效果很好，当我单击 LayerSwitcher 中的复选框时，日志就会在控制台上消失。

但是我想要的不是日志，而是这样的：

...this.map.getLayers()...

但是

this.map

在此函数中未定义。

有没有办法在监听某个图层的change事件的同时对整个地图进行操作？

Answer 1

函数有它自己的上下文，因此没有

map

属性。 尝试使用具有其父级上下文的箭头函数

vectorLayer.on('change:visible', () => {
   console.log('selected')
   ... this.map ... etc
});