1. 컴포넌트 라이프사이클 후킹
컴포넌트 인스턴스는 Angular가 컴포넌트 클래스의 인스턴스를 생성한 시점부터 미리 정의된 라이프사이클을 따라 동작하며 라이프사이클 단계에 따라 화면에 렌더링되고 자식 컴포넌트를 화면에 추가한다. 컴포넌트가 동작하는 동안 프로퍼티로 바인딩된 데이터가 변경되었는지 감지하며, 값이 변경되면 화면과 컴포넌트 인스턴스에 있는 데이터를 갱신한다.
라이프사이클은 Angular가 컴포넌트 인스턴스를 종료하고 DOM에서 템플릿을 제거할 때까지 이어진다. 그리고 디렉티브도 컴포넌트와 비슷하게 Angular가 인스턴스를 생성하고 갱신하며 종료하는 라이프사이클을 따른다. 우리는 라이프사이클 후킹 메서드를 사용해서 컴포넌트나 디렉티브가 동작하는 라이프사이클에 개입해서 원하는 작업을 할 수 있다.
2. 라이프사이클 이벤트 순서
ngOnChanges()
-
용도 : 바인딩된 입력 프로퍼티 값이 처음 설정되거나 변경될 때 실행한다. 프로퍼티의 이전 값과 현재 값을 표현하는 SimpleChanges 객체를 인자로 받는다. 이 메서드는 매우 자주 실행되니까 복잡한 로직을 작성하면 성능이 크게 저하될 수 있다.
-
실행 시점 : ngOnInit()이 실행되기 전에 한 번 실행되며 입력 프로퍼티로 바인딩된 값이 변경될 때마다 실행된다. 컴포넌트에 입력 프로퍼티가 없거나, 선언하고 사용하지 않는다면 ngOnChanges()가 실행되지 않는다.
블로그 운영 x