본문 바로가기

공부/TIL-D

생명주기

컴포넌트 , 디렉티브는 생명주기를 가짐. 생명주기란 컴포넌트와 디렉티브가 생성되고 소멸되는 여러 과정.
angular는 생명주기를 기반, 생명주기 훅 메소드를 구현해야함

생명주기 메소드는 인터페이스 형태 (가장흔한게 OnInit) 단 OnInit은 추상메소드

생명주기는 동일한 이름의 인터페이스가 존재 ng 접두어를 붙혀 추상메소드를 구현


컴포넌트 ,디렉티브도 클래스 -> 컨스트럭터의 호출에 의해 생성 -> Angular는 특별한 시점에 구현된 생명주기 훅 메소드 호출

)ngOnChange -> 부모, 자식 입력프로퍼티로 바인딩한 값이 초기화 또는 변경되었을 때, 실행

컴포넌트에 입력프로퍼티가 없다 -> 호출필요 xx

ngOnit 전에 입력프로퍼티 존재, 최소 1회호출, 원시타입값 재할당, 객체의 참조가 변했을때 

)ngOnInit 

ngOnChange이후 입력프로퍼티를 포함, 모든 프로퍼티가 초기화가 완료된 시점에 한번 호출

타입스크립트와 다르게, 프로퍼티의 초기화를 ngOnInit에서 해주는게 좋음

-> Constructor에서 복잡한 처리 피하기.

construcotr가 실행되는 시점 -> 프로퍼티 초기화 이전상태 ,참조시 undefined 반환 ngOnit에서 입력프로퍼티 참조 보장

)ngDoCheck

ngOnit이후, 컴포넌트 또는 디렉티브의 모든 상태변화가 발생할 '때'마다 호출 변화감지 로직 실행 -> 호출

)ngAfterContentInit

ngContent 디렉티브를 사용하여, 외부 콘텐츠를 컴포넌트 뷰에 (content projection)한 이후 호출.

ngDoCheck 호출 이후 한번만 호출

)ngAfterContentChecked

콘텐츠 프로젝션에 의해 부모 컴포넌트가 전달한 부모 컴포넌트의 템플릿 조각을 체크한 후 호출.
ngDoCheck가 호출된 이후에 호출, 컴포넌트에서만 동작하는 컴포넌트 전용 메소드

)ngAfterViewInit

컴포넌트의 뷰와 자식 컴포넌트 뷰를 초기화 한후 호출 , ngAfterContentChecked 호출 이후 한 번만 호출 컴포넌트 전용 훅 메소드

ngAfterViewChecked

컴포넌트 뷰와 자식 컴포넌트의 뷰를 체크한 이후 호출, ngAfterViewInit 호출 이후, ngAfterContentChecked 호출 이후 호출
컴포넌트 전용 훅 메소드

ngOnDstroy

컴포넌트와 디렉티브가 소멸하기 이전 호출 메모리 누수 방지 위한 코드 정의


반응형

'공부 > TIL-D' 카테고리의 다른 글

배열안의 원소의 합을 반복문을 사용하지 않고 구하기  (0) 2019.07.31
Cold observalbe Hot observable  (0) 2019.06.27
scroll 복습  (0) 2019.06.24
0620  (0) 2019.06.20
@Input @Output  (0) 2019.06.20