2016-04-06 75 views
9

Ho un GridComponent all'interno di un PopupComponent.Angolare 2 come inviare eventi dal nipote al componente principale?

Desidero inviare un evento personalizzato "RowSelected" a un componente al di fuori di PopupComponent.

Attualmente sto inviando l'evento da GridComponent a PopupComponent e lo inoltro all'esterno. Questo è un approccio molto doloroso poiché ho in programma di avere tonnellate di PopupComponents.

C'è un altro modo per fare l'inoltro di eventi?

+4

Utilizzare un servizio con un oggetto, vedere https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#bidirectional-service –

+0

Grazie per la risposta! Devo testarlo. –

+0

Sapete se diversi ** GridComponent ** s (ad esempio uno contiene persone e l'altro contiene lavori) condivideranno lo stesso servizio? Sarebbe un peccato per me. –

risposta

13

Ogni volta che non si dispone di una relazione figlio diretta genitore →, utilizzare un servizio (condiviso) per condividere dati e/o inviare eventi.

All'interno del servizio, utilizzare un oggetto o un osservabile per ottenere ciò.

cookbook ha un esempio di come utilizzare un oggetto per ottenere una comunicazione bidirezionale tra i componenti.

Questo post SO, Delegation: EventEmitter or Observable in Angular2, ha un esempio di come utilizzare un Observable.

+0

Grazie! Tutto funziona bene quando c'è un genitore => nipote, ma quando il "nipote" è solo nel contesto dell'applicazione, dice: 'Nessun provider per il servizio (nipote -> servizio)' –

+1

@ LukaŠilje, suona come non hai un servizio definito (usando 'provider') abbastanza in alto nella tua gerarchia di componenti. Suggerisco di dare un'occhiata al [Hierarchical Injectors doc] (https://angular.io/docs/ts/latest/guide/hierarchical-dependency-injection.html). –

+0

Ciao di nuovo. Funzionava fino a quando non ho convertito in versione 2.0.0. Qualche idea? Sto inserendo il servizio nei provider di AppComponent. –