MEAN Cookbook

There's more...

Child components can also bubble up actions to parent components. For instance, let's convert our Create New Post button into a new PostCreator component. We can bubble our click action from the PostCreator to the parent Posts component:

<button (click)="launch($event)" class="btn btn-block btn-primary">  <fa [name]="'plus'" [fw]=true></fa>Create New Post</button>

import {Component, EventEmitter, Output} from '@angular/core';@Component({  selector: 'app-launcher',  templateUrl: './launcher.component.html',  styleUrls: ['./launcher.component.scss']})export class PostCreator {  @Output() open = new EventEmitter();  constructor() {}  launch(event) {    this.open.emit(event);  }}

The @Output decorator creates a new custom event on the component ...