Hook ngOnInit dalam Angular

Hook ngOnInit berfungsi semasa pengawalan komponen. Dari segi tindakan, ia menyerupai pembina kelas, tetapi di dalamnya anda boleh menjalankan tugas yang lebih kompleks, contohnya, memuat data dari pelayan.

Mari kita lihat bagaimana menggunakan hook ini. Pertama, anda perlu mengimport antar mukanya:

app/user/user.component.tsimport { OnInit } from '@angular/core';

Seterusnya, anda perlu memasukkan antaramuka ke dalam kelas komponen:

app/user/user.component.tsexport class UserComponent implements OnInit {

}

Selepas itu, kita boleh menulis kaedah ngOnInit dalam kelas komponen dan kaedah ini akan dilaksanakan secara automatik semasa pengawalan kelas. Mari kita semak kerjanya:

app/user/user.component.tsexport class UserComponent implements OnInit {
  constructor() {
    console.log('constructor is started');
  }
  ngOnInit() {
    console.log('onInit is applied');
  }
}