将数据从ng-template传递到其父组件Angular 4

import { Component, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'child-component',
  template: `
    <ng-template>
      <!-- 在ng-template中触发事件 -->
      <button (click)="passData()">传递数据</button>
    </ng-template>
  `
})
export class ChildComponent {
  @Output() dataPassed = new EventEmitter<string>();

  passData() {
    const data = '这是要传递的数据';
    this.dataPassed.emit(data);
  }
}

import { Component } from '@angular/core';

@Component({
  selector: 'parent-component',
  template: `
    <child-component (dataPassed)="receiveData($event)"></child-component>
    <p>接收到的数据：{{ receivedData }}</p>
  `
})
export class ParentComponent {
  receivedData: string;

  receiveData(data: string) {
    this.receivedData = data;
  }
}