角度2と持つEventEmitter

Question

こんにちは、私は3つの要素を持っている はたぶん誰かが角2

で持つEventEmitterと出力についての私の質問で私を助けることができる2.アンギュラ勉強を始めました。

AppComponentはCountriesListComponentの親です。 CountriesListComponentはCountryInfoComponentの親です。 AppComponent - > CountriesListComponent - > CountryInfoComponent

AppComponentは、ある国をクリックしたときに聴く機能を持っています。 AppComponentの

テンプレートは、このようなものです：

@Component({ 


template: `... 

< countries-list (OnCountrySelected)="countryWasClicked($event)" > 
< /countries-list > 
` 
... 

}) 

class AppComponent { 
countryWasClicked(country: Country): void 
    { 

    } 
} 

機能OnCountrySelectedは私が聞きたい出力の名前です。しかし、CountriesListComponentの次の子でしか聞くことはできません。 CountryInfoComponentでOnCountrySelectedを聴きたいです。 しかし、出力をいくつかの子供に送ることができるかどうかはわかりません。

ありがとうございます！

Answer 1

イベントを連鎖させることはできますが、それはベストプラクティスではありません。

@Component({ 
template: `... 
    < country-info (OnCountrySelected)="countryWasClicked($event)" > 
    < /country-info > 
` 
... 
}) 
class CountriesListComponent { 
@Output() OnCountrySelected:EventEmitter = ... 
countryWasClicked(country: Country): void 
    { 
    this.OnCountrySelected.emit(country); 
    } 
} 

しかし、私は、複雑なアプリケーションの状態ロジックのReduxのアプローチを使用する（学ぶ）することをお勧めしますが、あなたがこれを使用することができます：CountriesListComponentのテンプレート内でこのよう は https://github.com/ngrx/store

Answer 2

これは、あなたが見つけるのに役立つかもしれませんあなたの答え（より具体的に共有モデルやサービスイベント）：あなたはCountryInfoComponで@Input（）デコレータを必要

https://stackoverflow.com/a/34703015/6157104

Answer 3

おそらくそれを国と名付けるべきです。次にCountryListComponentで、選択した国にthis <app-country-info [country]="selectedCountry">のような情報コンポーネントを渡します。選択された国はCountryListComponentのパブリックプロパティでなければなりません。既にその値をあなたの関数で設定することができます。

長いストーリーは、入力デコレータの状況であり、出力デコレータではありません。