Pass Event from child component to parent component Angular 5

Angular has Input and Output, which can be used to provide data to a child component and send events to a parent component respectively.

You can do something like this.

program-page.component.html

<app-program-header></app-program-header>
<app-week-display></app-week-display>
<app-program-item [item]="programItem" (someEvent)="someFunction($event)"></app-program-item>

program-item.component.ts

import { EventEmitter } from '@angular/core';
....
@Output() someEvent = new EventEmitter();

program-item.component.html

<button (click)="someEvent.emit('data')">click me</button>

Primitive usage of Input and Output
Stackblitz example

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)