Thursday, June 2, 2022

Angular: How to pass data from Child to parent component

Register the EventEmitter in your child component as the @Output:

@Output() onDatePicked = new EventEmitter<any>();

Emit value on click:


public pickDate(date: any): void {

    this.onDatePicked.emit(date);

}

Listen for the events in your parent component's template:

<div>

    <calendar (onDatePicked)="doSomething($event)"></calendar>

</div>

and in the parent component:

public doSomething(date: any):void {

    console.log('Picked date: ', date);

}

It's also well explained in the official docs

https://angular.io/guide/component-interaction

references:

https://angular.io/guide/component-interaction

https://stackoverflow.com/questions/42107167/how-to-pass-data-from-child-to-parent-component-angular

No comments:

Post a Comment