라이프싸이클 후킹 함수

컴포넌트 인스턴스가 생성되면 Angular는 생성시점부터 미리 정의된 라이프싸이클을 따라 화면을 렌더링한다.

<a [attr]="prop" >

<input type='text' [ngModel]='val' >

컴포넌트 인스턴스 프로퍼티값이 변경되면 화면을 랜더링하고 사용자이벤트로 컴포넌트 인스턴스 프로퍼티값이 갱신하기도 한다.

라이프싸이클 후킹 메서드(lifecycle hook method)를 사용하면 인스턴스가 생성되는 시점, 데이터변화가 감지되는 시점, 데이터변화가 감지된 이후 시점, 인스턴스가 종료되는 시점에 원하는 동작을 할 수 있다.

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
    console.log(1);
  }

}