angular中的传值问题 @Output（EventEmitter)、@Input

哈~你来啦

---

@Input() 允许父组件更新子组件中的数据。相反，@Output() 允许子组件向父组件发送数据。

一、@Input 父传子

1.1 子组件

// 引入
// OnInit, Input都是装饰器
import {
    Component, OnInit, Input} from "@angular/core";

export class childComponent implements OnInit {
   
	// 定义变量
    @Input() unit: string = "";

    constructor() {
   
    }
    ngOnInit() {
   
    // 使用时候直接this.unit
    }
}

1.2 父组件

// html中：
<app-child [unit]="unit"></app-child>
// ts中
// 定义变量即可

二、@Output子传父

一般通过事件来触发

2.1 父组件

// html
<app-child