In bellow example how to call child component furcation callme() from parent component.
parent.component.html
Bellow code When you click the click me button, it calls the child component function callMe().
<button (click)="callMyChild()">Click Me</button> <app-child></app-child>
parent.component.ts
@Component({
selector: 'app-parent',
templateUrl: './parent.component.html',
styleUrls: ['./parent.component.scss']
})
export class ParentComponent implements OnInit {
@ViewChild(ChildComponent, {static : true}) child : ChildComponent;
callMyChild(){
child.callMe('Calling from the parent!');
}
}
child.component.ts
@Component({
selector: 'app-child',
templateUrl: './child.component.html',
styleUrls: ['./child.component.scss']
})
export class ChildComponent implements OnInit {
callMe(value : string) {
console.log('Called : ' + value);
}
}
