Sunday, February 18, 2018

Passing data from Parent to Child using Local variable

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:

Followers

Link