Angular Input 和 Output傳值的差別

父子組件進行信息交流

1. 基礎步驟

2. 具體操作請參考
   https://blog.csdn.net/qq_43579525/article/details/83935694
3. 當父組件定義了一個getDataFromChild 函數時，傳入子組件中後，當子組件調用時

// 父組件函數
value: number;
getDataFromChild(data){
	alert(data);
}

// 子組件調用
clickButton(){
	this.getDataFromChild();
}

4. 正常使用沒有問題，當父組件中需要賦值到自己的一個變量時，此時會發現 this.value 是 undefined
5. 在父組件的getDataFromChild 中打印 this 會發現，this 指向的是子組件

value: number;
getDataFromChild(data){
	alert(data);
	console.log(this);
	this.value = data; // 此句報錯
}

6. 此時可以得出結論， @Input 比較適合傳入變量，而不適合傳入函數進行回調
7. 使用 @Ouput, emit 事件傳入父組件的方法則不會出現問題