angular生命週期

指令和元件的例項有乙個生命週期：新建、更新和銷毀。 通過實現乙個或多個 angularcore庫里定義的生命週期鉤子介面，開發者可以介入該生命週期中的這些關鍵時刻。

每個介面都有唯一的乙個鉤子方法，它們的名字是由介面名再加上ng字首構成的。比如，oninit介面的鉤子方法叫做ngoninit， angular 在建立元件後立刻呼叫它，：

生命週期的順序：

鉤子用途及時機

ngonchanges()當 angular（重新）設定資料繫結輸入屬性時響應。 該方法接受當前和上一屬性值的******changes物件當被繫結的輸入屬性的值發生變化時呼叫，首次呼叫一定會發生在ngoninit()之前。

ngoninit()在 angular 第一次顯示資料繫結和設定指令/元件的輸入屬性之後，初始化指令/元件。在第一輪ngonchanges()完成之後呼叫，只呼叫一次。

ngdocheck()檢測，並在發生 angular 無法或不願意自己檢測的變化時作出反應。在每個 angular 變更檢測週期中呼叫，ngonchanges()和ngoninit()之後。

ngaftercontentinit()當把內容投影進元件之後呼叫。第一次ngdocheck()之後呼叫，只呼叫一次。

ngaftercontentchecked()每次完成被投影元件內容的變更檢測之後呼叫。ngaftercontentinit()和每次ngdocheck()之後呼叫

ngafterviewinit()初始化完元件檢視及其子檢視之後呼叫。第一次ngaftercontentchecked()之後呼叫，只呼叫一次。

ngafterviewchecked()每次做完元件檢視和子檢視的變更檢測之後呼叫。ngafterviewinit()和每次ngaftercontentchecked()之後呼叫。

ngondestroy()當 angular 每次銷毀指令/元件之前呼叫並清掃。 在這兒反訂閱可觀察物件和分離事件處理器，以防記憶體洩漏。在 angular 銷毀指令/元件之前呼叫。

ngonchanges函式觸發的例子：

父元件：

import  from '@angular/core';

import  from '../log-custom.service';
@component()
export class
parentcomponent
implements
oninit 
ngoninit() 
}// 模板
姓名："text" [(ngmodel)]="name">
名字為}div>
div>

import  from '@angular/core';

import  from '../log-custom.service';
@component()
export class
childcomponent
implements
oninit, onchanges 
ngoninit() 
ngonchanges(changes: ******changes) 
}// 模板
該使用者的名字叫做 }

一般在ngoninit()函式中獲取初始資料是比較好的，ngafterviewinit()在元件互動中父元件獲取子元件屬性的例子中用到，還有ngafterviewchecked()

angular 生命週期

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

Angular生命週期

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

angular 元件生命週期

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