イオン2（Typescript） - 可変スコープと変数を渡す問題

Question

私はこのイオン2のタイスクリプトファイルを持っています。変数の値を別のメソッドから設定しようとしています。私はモーダルを閉じるときにundefinedを受け取った。

コールドの値を設定できません。マーカーのドラッグイベントで

export class RegisterMapPage { 

     .. essential var here.. 
     public coord: any; 

     constructor(
      .... 
    ) {} 

     ionViewDidLoad() { 
      this.initMap() 
     } 

     initMap() { 
      this.geolocation.getCurrentPosition().then((position) => { 

        // // // ..... All map related code here.... 

        google.maps.event.addListener(marker, 'dragend', function() { 
         this.coord = marker.getPosition().lat() + ', ' + marker.getPosition().lng(); 
         console.log(this.coord); // prints perfectly here. 
        }); 

      }, (err) => { 
        console.log(err); 
      }); 
     } 

     chooseCoord() { 
      console.log(this.coord); // undefined ?? 
      this.viewCtrl.dismiss(this.coords); 
     } 

} 

私は、変数の値またはCOORDを更新するが、私はそれを印刷する際に値が定義されていません。コードで私を助けてくれますか？

ありがとうございました。

Answer 1

コールバックメソッド内のthisは、コールバックにfunction() {}構文を使用しているため、RegisterMapPageインスタンスではないためです。正しいコンテキストを取得するには、arrow functionを使用してください。

google.maps.event.addListener(marker, 'dragend',() => { 
    this.coord = marker.getPosition().lat() + ', ' + marker.getPosition().lng(); // `this` here will point to `RegisterMapPage` instance now that you use arrow function 
    console.log(this.coord); // prints perfectly here. 
});