打字稿中的范围变量

Question

我正在Ionic 2 App上使用Angular 2(打字稿(。我有一个具有私有属性siteForm的类NewFavoriteSitePage，我可以在类方法中使用此属性，但是当我在一个谷歌地图方法中时，这个变量是未定义的。变量的作用域是什么，或者如何定义要从两端访问的变量？

declare var google;
......
export class NewFavoriteSitePage {
.....
private siteForm: FormGroup;
loadMap(){
//I can access to siteForm here!
.....
google.maps.event.addListener(marker, 'dragend', function(marker, siteForm){
let newlatLng = marker.latLng; 
console.log(this.siteForm); //Here this.siteForm is undefined
});
}

Answer 1

谷歌地图没有在那里定义的原因，是因为它是一个函数的回调，这使得"this"不再等于页面，将其放在变量中将解决问题。

private siteForm: FormGroup;
loadMap(){
var siteformFromPage=this.siteForm; //this should work
google.maps.event.addListener(marker, 'dragend', function(marker, siteForm){
let newlatLng = marker.latLng; 
console.log(siteformFromPage);
});
}

编辑：如果你想要最新的值，你也可以尝试这样：

private siteForm: FormGroup;
loadMap(){
var that=this; //cache that value of the page.
google.maps.event.addListener(marker, 'dragend', function(marker, siteForm){
let newlatLng = marker.latLng; 
console.log(that.siteformFromPage);
});
}

Answer 2

使用箭头函数保留上下文：

google.maps.event.addListener(marker, 'dragend', (marker, siteForm) => {
let newlatLng = marker.latLng; 
console.log(this.siteForm);
});