A child component which will hide based on the visible variable. For more, visit http://angularman.wordpress.com

child.component.ts

import { Component } from '@angular/core'

@Component({
  selector: 'toggle',
  template: `
    <div *ngIf="visible" style="color: green;">
        <h3>The content in the child component</h3>
    </div>
  `
})

export class ToggleComponent {
  visible: boolean = true;
  toggle(): void{
    this.visible = !this.visible;
  }
}