Posso passare variabili usando EventEmitter dal componente angular2?

Question

Sono nuovo ad angular2 quindi scusami se uso i termini sbagliati nel descrivere il mio problema.

Ho un componente semplice che consente all'utente di scegliere un'opzione. Ora voglio inviare questa opzione al componente principale. Sto facendo questo:

// import the necessary angular2 resources: 
import {Component, Output, EventEmitter} from 'angular2/core'; 
... 
// create the emitter in my component class: 
export class MyClassThatLetsUserSelectSomeContentId{ 
    @Output() selectEvent: EventEmitter<any> = new EventEmitter(); 
    public selectedId: string; 
    // this does get called, showing the correct id in the console 
    onSelect(selectedItem: MyCustomItem){ 
     this.selectedId = selectedItem.id; 
     console.log("selectedId:" + this.selectedId); 
     this.selectEvent.emit(this.selectedId); 
    } 
} 

e nel componente principale che includono nel modello come questo:

<my-selector-component (selectEvent)="onItemSelected(selectedItemId)"></my-selector-component> 

E la funzione fa arrivare calles, ma la variabile non è definita:

onItemSelected(selectedItemId: string){ 
    console.log("onItemSelected(" + selectedItemId + ")"); 
} 

l'uscita della console è:

registro: onItemSelected (undefined)

Quindi cosa mi manca? L'evento viene inviato e la funzione viene chiamata ma il parametro viene perso.

Forse qualche altra forma di associazione all'id selezionato sarebbe meglio del tutto. Sono aperto a qualsiasi tipo di soluzione finché il componente principale può reagire a una nuova selezione dal componente della vista.

Answer 1

è necessario utilizzare la variabile $event per ottenere il valore che si invia quando si attiva l'evento:

<my-selector-component (selectEvent)="onItemSelected($event)"> 
</my-selector-component> 

Il valore che fornisci come parametro del metodo della EventEmitteremit corrisponde ad esso.