Hook ngOnInit trong Angular

Hook ngOnInit được kích hoạt khi khởi tạo component. Về hành động, nó tương tự như hàm tạo (constructor) của lớp, nhưng trong đó có thể thực hiện các nhiệm vụ phức tạp hơn, ví dụ: tải dữ liệu từ máy chủ.

Hãy xem cách sử dụng hook này. Đầu tiên cần nhập giao diện (interface) của nó:

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

Tiếp theo cần đưa giao diện vào lớp component:

export class UserComponent implements OnInit {

}

Sau đó, chúng ta có thể viết phương thức ngOnInit trong lớp component và phương thức này sẽ tự động thực thi khi khởi tạo lớp. Hãy kiểm tra hoạt động của nó:

export class UserComponent implements OnInit {
	constructor() {
		console.log('constructor is started');
	}
	ngOnInit() {
		console.log('onInit is applied');
	}
}

Hãy tạo một phương thức riêng tư show và gọi nó khi component được khởi tạo.