typescript访问监听器中的全局变量

Question

我有一个Angular 2项目，我想测试事件监听器。 这被定义

map; 

然后在填入映射方法，我有

populateMap() { 


var place = { lat: -17.822828, lng: -31.046727 }; 
this.map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 12, 
    center: place, 
    mapTypeControlOptions: { 
    style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR, 
    position: google.maps.ControlPosition.TOP_RIGHT 
    }, 
    maxZoom: 19 
}); 


this.map.addListener('click', function (e) { 
var marker = new google.maps.Marker({ 
    position: e.latLng, 
    map: this.map 
    }); 
    this.map.panTo(e.latLng); 
}); 


this.map.fitBounds(this.bounds); 
this.map.panToBounds(this.bounds); 
} 

一个例外是在

Uncaught TypeError: Cannot read property 'panTo' of undefined 

听众扔有一个原因，JavaScript是无法找到正确的“this.map”参考，忘了提及，这是Google Maps API v3

Answer 1

您位于不同的上下文中，因此this不引用外部上下文。你必须保留一个引用，例如

var self = this; 
this.map.addListener('click', function (e) { 
var marker = new google.maps.Marker({ 
    position: e.latLng, 
    map: self.map 
    }); 
    self.map.panTo(e.latLng); 
});