Benutzerdefiniertes Ereignis mit @Input und @Output

Question

Ich versuchte, meinen Kopf um @Input und @Output zu bekommen und hoffte auf Hinweise, wie mein Ansatz falsch ist.

Im app.component ELTERN COMPONENT habe ich folgendes

@Output() dateChanged = new EventEmitter(); 
dateSelected:any; 

onDateSelected() { 
    this.dateSelected = this.yearValue + "|" + this.monthValue; 
    console.log(this.dateSelected);//is selected and prints out to console 
    this.dateChanged.emit(this.dateSelected); 
} 

dies der HTML-

<div> 
<!--app.component.html--> 

     <app-expenses (dateChanged)="onDateSelected($event)"></app-expenses> 
</div> 

geordnete Komponente Im Kind (ExpensesComponent) Komponente ist wie folgt

@Input() dateChanged: any; 

onDateSelected(e) { 
    console.log(e);//doesnt reach this point 
} 

onDateSelected wird nicht vonausgelöstWas wäre eine gute Möglichkeit, diesen Datumswert an das Kind weiterzugeben?

Dank

Answer 1

@Output() Veranstaltungen sind für die Eltern für Veranstaltungen der Kinder Komponenten, nicht umgekehrt zu hören.

Für die Eltern-Kind-Kommunikation können Sie die Datenbindung verwenden.

<app-expenses [selectedDateInChild]="selectedDateOfParent"></app-expenses>