Parent component:
<app-child-component [item]="data"></app-child-component>
Child component.ts
import { Component, Input } from '@angular/core'; // First, import Input
export class ItemDetailComponent {
@Input() item = ''; // decorate the property with @Input()
}
//app.html:
<h1>this is perent component</h1>
<app-child [items]="employee"></app-child>
//app.component.ts:
employee = {
id: 1,
name: 'chintan',
address: 'junagadh',
};
//child.component.ts:
@Input() items: any;
//child.html:
<h2>{{ items.id }}</h2>
<h2>{{ items.name }}</h2>
<h2>{{ items.address }}</h2>