javascript - 在 Angular 中将函数传递给其他对象时出现问题

Question

我在将函数传递给 Angular 中的其他对象时遇到问题。具体来说，我创建了一个函数generateTile(coords)，它填充一个图 block ，然后将其提供给传单。该函数位于 MapComponent 方法中。我想我明白为什么这是一个问题，因为 this 指的是不同的上下文。但是我不知道如何解决这个问题。

generateTile(coords) {
    ...
    return image;
}

private initMap(): void {
    this.map = L.map('map', {
        crs: L.CRS.Simple,
        center: [0, 0],
        zoom: 5
    });

    L.TileLayer.CustomMap = L.TileLayer.extend({
        getTileUrl: function(coords) {
            var img = this.generateTile(coords);
            return img.src;
        },
        getAttribution: function() {
            return "<a href='https://example.com'>Example</a>"
        }
    });
...
}

Answer 1

使用箭头函数，这样您就不会为 this 创建范围。您可以阅读有关 this 在 JavaScript 中如何工作的更多信息，here is a link ，例如。

  getTileUrl: (coords) => {
                var img = this.generateTile(coords);
                return img.src;
            };