Angular笔记——子组件给父组件传值（类似VUE的事件传值方法）

想要像VUE一样通过$emit传值的方法在angular中同样存在

子组件给父组件传值
事件传递方式：@Output + EventEmitter事件传递的方式

子组件实例化装饰器修饰的EventEmitter实例，并在需要的时候发出传递事件的信号（可以传参）

import { Component, OnInit ,Input,Output,EventEmitter} from '@angular/core';
 
export class HeaderComponent implements OnInit {
 
    // 用EventEmitter和Output装饰器配合使用，<string>指定广播传递的参数类型变量
    @Output() private outer = new EventEmitter<string>(); 
    
    sendParent(){
        this.outer.emit('msg from child'); // 广播传递数据给父组件
    }
 
}

父组件调用子组件的时候，定义接收事件 , outer就是子组件的EventEmitter对象outer

<!--一旦接收到子组件发出的事件传递信号后就会执行父组件中定义好的接收方法-->
<app-header (outer)="runParent($event)"></app-header> 
 
 
// 接收子组件传递过来的数据 
runParent(msg:string){
    alert(msg); 
}

原文链接：https://blog.csdn.net/xfwdxt/...