Angular學習筆記30 生命週期鉤子

2021-09-11 01:32:16 字數 1185 閱讀 9341

angular 提供了生命週期鉤子,並把元件的關鍵生命時刻(初始化,發生變化,銷毀時等)暴露出來,讓開發者通過這些關鍵的生命週期時刻,更好的作出更好的邏輯處理。

ngoninit()這個生命週期鉤子是最常見的乙個生命週期鉤子,在使用angular-cli建立乙個新的元件的時候,angular-cli會自動的使用ngoninit這個生命週期鉤子。

建立乙個新的元件:

ng g c testlifecycle
然後開啟testlifecycle元件的類檔案就會發現:

這個生命週期鉤子:就是在元件被初始化時候就會呼叫這個鉤子。它是在生命週期鉤子:ngonchanges()完成第一次之後呼叫。

在這個元件使用過程中,ngoninit()這個生命週期鉤子只被呼叫一次。

使用ngonchange()這個生命週期鉤子,必須要先使testlifecyclecomponent實現:onchanges,然後使用ngonchange();即:

當 angular(重新)設定資料繫結輸入屬性時就會呼叫這個生命週期鉤子。

這個方法接受當前和上一屬性值的******changes物件

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

在testlifecyclecomponent中繫結乙個輸入屬性的值:

然後在控制台就可以看到:

就可以得到這個繫結的輸入屬性的值,每次變化的值,還有其他相關資訊。每當這個繫結的輸入屬性的值發生變化時,ngonchange()這個生命週期鉤子就會呼叫。

Angular學習 三 生命週期鉤子

angular提供了生命週期鉤子,把這些關鍵生命時刻暴露出來,賦予我們在它們發生時採取行動的能力。可以將鉤子函式理解為在合適的時候做合適的事情。官方給出的解釋是 每個元件都有乙個被 angular 管理的生命週期。angular 建立它,渲染它,建立並渲染它的子元件,在它被繫結的屬性發生變化時檢查它...

Angular2 生命週期

元件生命週期鉤子 指令和元件的例項有乙個生命週期 新建 更新和銷毀。每個介面都有唯一的乙個鉤子方法,它們的名字是由介面名加上ng字首構成的。比如,oninit介面的鉤子方法叫做ngoninit。指令和元件 ngoninit 當angular初始化完成資料繫結的輸入屬性後,用來初始化指令或者元件。ng...

angular2 生命週期

ngonchanges 當資料繫結輸入屬性的值發生變化時呼叫 ngoninit 在第一次 ngonchanges 後呼叫 ngdocheck 自定義的方法,用於檢測和處理值的改變 ngaftercontentinit 在元件內容初始化之後呼叫 ngaftercontentchecked 元件每次檢查...