Parent Template can access the child component properties and methods by creating the template reference variable.
No change in child component.
parent.component.ts is
import { Component} from '@angular/core';
@Component({
selector: 'app-root',
template: `
<h1>{{title}}!</h1>
<p> current count is {{child.count}} </p>
<button (click)="child.increment()"<Increment</button>
<button (click)="child.decrement()"<decrement</button>
<child-component #child></child-component>` ,
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'Parent interacts with child via local variable';
}
No comments:
Post a Comment