Anil Kumar
Apr 24, 2023

How to send data from Parent to Child component in angular ?

Photo by Zetong Li on Unsplash

communication / interaction is for making things work is needed.

So for sending data from child to parent component we use Input function( Input decorator ) feature of component to receive data.

lets say we component hero (child) in heroes ( parent list component)

hero should have input

export class HeroChildComponent {
@Input() hero!: Hero;

Inside template view/html of Parent component

 <app-hero-child
*ngFor="let hero of heroes"
[hero]="hero">
</app-hero-child>