注：以下學(xué)習(xí)筆記均來源于Angular教程_Angular8 Angular9 Angular12入門實(shí)戰(zhàn)視頻教程

一、Angular 父子組件以及組件之間通訊

1.父組件給子組件傳值 @input

父組件不僅可以給子組件傳遞簡單的數(shù)據(jù)，還可以把自己的方法以及整個父組件傳給子組件。

• 父組件調(diào)用子組件的時候傳入數(shù)據(jù)

• 子組件引入 Input 模塊

• 子組件中 @input 接收父組件傳過來的值

2.父組件通過 @ViewChild 主動獲取子組件的數(shù)據(jù)和方法

• 調(diào)用子組件，給子組件定義一個名稱

• 父組件引入 ViewChild 模塊

• 獲取子組件的數(shù)據(jù)，執(zhí)行子組件的方法

3.子組件通過 @Output 觸發(fā)父組件的方法

• 子組件引入 Output 和 EventEmitter

• 子組件中實(shí)例化 EventEmitter

• 子組件通過 EventEmitter 對象 outer 實(shí)例廣播數(shù)據(jù)

• 父組件調(diào)用子組件的時候，定義接收事件，outer 就是子組件的 EventEmitter 對象 outer

• 父組件接收到數(shù)據(jù)會調(diào)用自己的 runParent 方法，這個時候就能拿到子組件的數(shù)據(jù)

4.非父子組件通訊

• LocalStorage

• 服務(wù)

二、Angular 中的生命周期函數(shù)

按照官方文檔，生命周期函數(shù)通俗的講就是組件創(chuàng)建、組件更新、組件銷毀的時候會觸發(fā)的一系列的方法，也叫生命周期鉤子方法。