Angular官方文档Demo地址：>component-interaction#parent-listens-for-child-event
举一个自己在写的项目??
子组件 imageupload 中的一个事件 onCropped(e:ImgCropperEvent)
onCropped(e: ImgCropperEvent) { this.croppedImage = e.dataURL; console.log("cropped img: ", e); // console.log("dataURL", e.dataURL); this.imgurl = e.dataURL; this.getImgUrl.emit(this.imgurl); }
目的：是想要在父组件中获取到子组件的数据，我选择了通过监听事件的方法来传递。
用到的组件：
import {Output,EventEmitter} from "@angular/core";
@Output() getImgUrl = new EventEmitter<string>();
@Output() 声明getImgUrl的同时输出
子组件的CSS selector名：
父组件 使用该selector：
<app-images-editorbox (getImgUrl)="onGetImgUrl($event)"></app-images-editorbox>
当监听到事件发生时会调用onGetImgUrl()事件处理, 事件参数(用 $event 表示)传给事件处理方法。
onGetImgUrl(imgUrl: string) { this.imgUrl = imgUrl; }
画个图梳理一下：
当然了还有许多方法来进行组件之间的通讯，选择合适的方法来进行开发。
原文：https://www.cnblogs.com/braink-1400/p/11477053.html