打字稿

Question

我在Ionic 2 App上使用Angular 2（Typescript）。我有一个具有私有属性NewFavoriteSitePage的类siteForm，我可以在类方法中使用此属性，但是当我在一个google maps方法中时，此变量未定义。变量的范围是什么或如何定义要从双方访问的变量？

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

之所以没有定义google maps的原因，是因为它是函数的回调，这使得'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);
  });