未定義のemit（）プロパティ - EventEmitter/@Output issue

Question

子コンポーネントを持つ親コンポーネントがあります。私は親と子の間に拘束力を持っていますが、詳細は見当たりません。子どもから親に向かうもう一つの方向は、angular4/typescriptは私にとって初めてのことなので私の無知です。

したがって、親コンポーネントは子コンポーネントをホストし、データを子ファインに渡します。

<app-component-name>は、ユーザーがGoogleマップAPIを経由して緯度/経度にジオコード列アドレスを入力することを意図して、ダイアログ子コンポーネントであることを起こる

<app-component-name (onSomethingAdded)="doSomethingWithIt($event)"></app-component-name> 

。ダイアログが正常に表示され、入力が入力され、正常に戻ります。ジオコーディングが実行され、問題は発生しません。問題は、マップなどの親コンポーネントに戻るなどです。私はそれのためのマーカーを追加することができます。

私は@Ouputを宣言します。

@Output() 
onSomethingAdded = new EventEmitter<{animation:any, title: string, position: {lat:number, lng:number}}>(); 

その後バック（私はダイアログ子コンポーネントで入力からジオコーディングを行う場所、それはまたですので、細かい発射）親コンポーネントにこの時間を浪費を発するようになっています方法は次のようになります...

addNewSomething(newLoc) { 

    // A bunch of other stuff omitted for the sake of a small example 
    // THIS BUGGER below pukes at me 
    // Uncaught TypeError: Cannot read property 'emit' of undefined 

     this.onSomethingAdded.emit({ 
      animation: google.maps.Animation.DROP, 
      title: newLoc.form.controls.title.value, 
      position: { 
      lat: res[0].geometry.location.lat(), 
      lng: res[0].geometry.location.lng() 
      } 
     }); 
} 

newLocは、ダイアログ入力からngFormから戻ってきて、うまく見えるオブジェクトです.Googleマップは、表示されているように、緯​​度/経度の罰金とデータを返します。だから私はあなたのうちの一人がこれ以上長い間私の愚かなことを本当に素早く見つけることができると期待しているのですが、なぜ私はそれが不確定なのですかemitプロパティ？私は何かを定義するのを忘れるような何かのことをしましたか？

私は放出しようとしているすべての値があることを知っているので、私は明らかにいくつかの基本的な定義や何かが間違っていますか？手学習に感謝します。

Answer 1

したがって、問題はネストされたメソッドによって提供される変数スコープにあることが判明しました。他の読者にとっては、これは擬似的な修正です。

addNewSomething(newLoc) { 

    const that = this; 

    aChildMethod() { 


     yetAnotherNestedMethod() { 

     that.onSomethingAdded.emit({ 
      animation: google.maps.Animation.DROP, 
      title: newLoc.form.controls.title.value, 
      position: { 
      lat: res[0].geometry.location.lat(), 
      lng: res[0].geometry.location.lng() 
      } 
     }); 
     } 
    } 
}; 

ここで、that=this;が修正されました。誰も助けてくれてありがとう。 :)