angular元件生命週期

2021-10-25 21:22:18 字數 1366 閱讀 2387

當angular例項化元件類並渲染元件檢視及其子檢視時,元件例項的生命週期就開始了。生命週期一直伴隨著生命檢測,angular會檢查資料繫結屬性何時發生變化,並按需更新檢視和元件例項。當angular銷毀元件例項並從dom中移除塔渲染的模板時,生命週期就結束了。當angular在執行過程中建立、更新和銷毀例項時,指令就有了類似的生命週期。

在應用中,可以使用生命週期鉤子方法來觸發元件或生命週期中的關鍵事件,以初始化新例項,需要時啟動變更檢測,在變更檢測過程中響應更新,並在刪除例項之前進行清理。

鉤子方法

用途時機

ngonchanges()

當angular設定或者重新設定資料繫結的輸入屬性時響應。該方法接受當前和上一屬性值的******changes物件。

注意:這裡發生的非常頻繁,所以在這裡執行的任何操作都會顯示影響效能。

在ngoninit()之前,以及所繫結的乙個或者多個輸入屬性的值發生變化時都會被呼叫。

注意:如果元件沒有輸入,或者使用它時沒有提供任何輸入,那麼框架就不會呼叫ngonchanges()

ngoninit()

在angular第一次顯示資料繫結和設定指令/元件的輸入屬性之後,初始化指令/元件。

在第一輪ngonchanges()完成之後呼叫,只呼叫一次

ngdocheck()

檢測,並在發生angular無法或不願意自己檢測的變化時做出反應。

緊跟在每次執行變更檢測時候的ngonchanges()和首次執行變更檢測時的ngoninit()後呼叫。

ngaftercontentinit()

當angular把外部內容投影進元件檢視或指令所在的檢視之後呼叫

第一次ngdocheck()之後呼叫,只呼叫一次

ngaftercontentchecked()

每當anuglar檢查完被投影到元件或者指令中的內容之後呼叫。

ngaftercontentinit()和每次ngdocheck()之後呼叫

ngafterviewinit()

當angular初始化完元件檢視之後及其子檢視或包含該指令的檢視之後呼叫

第一次ngaftercontentchecked()之後呼叫,只呼叫一次。

ngafterviewchecked()

每當 angular 做完元件檢視和子檢視或包含該指令的檢視的變更檢測之後呼叫。

ngafterviewinit()和每次ngaftercontentchecked()之後呼叫。

ngondestroy()

每當 angular 每次銷毀指令/元件之前呼叫並清掃。

在 angular 銷毀指令或元件之前立即呼叫。

angular 元件生命週期

紅色方法是用來檢測變化 ngonchanges 當angular 重新 設定資料繫結輸入屬性時響應。該方法接受當前和上一屬性值的 changes 物件 當被繫結的輸入屬性的值發生變化時呼叫,首次呼叫一定會發生在 ngoninit 之前。ngoninit 在angular第一次顯示資料繫結和設定指令 ...

angular生命週期

指令和元件的例項有乙個生命週期 新建 更新和銷毀。通過實現乙個或多個 angularcore庫里定義的生命週期鉤子介面,開發者可以介入該生命週期中的這些關鍵時刻。每個介面都有唯一的乙個鉤子方法,它們的名字是由介面名再加上ng字首構成的。比如,oninit介面的鉤子方法叫做ngoninit,angul...

angular 生命週期

以下排序是按見面載入時的順利載入,如果直接寫ngdocheck 就要執行4次他的子方法 constructor ngonchanges changes changes void 元件中巢狀的 的內容的變化髒值檢查 ngaftercontentchecked void 元件檢視渲染完成,可以安全的操作...