หลายฮุกใน Angular

สามารถกำหนดหลายฮุกพร้อมกันได้ ลองมาดูวิธีการทำผ่านตัวอย่างของสองฮุกที่เราได้ศึกษามาแล้ว

นำเข้า Interface สองตัว:

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

เชื่อมต่อพวกมันกับคลาส:

app/user/user.component.tsexport class UserComponent implements OnInit, OnDestroy {
  
}

มาเขียนสองฮุกของเรา:

app/user/user.component.tsexport class UserComponent implements OnInit, OnDestroy {
  constructor() {
    console.log('constructor is started');
  }
  
  ngOnInit() {
    console.log('onInit is applied');
  }
  
  ngOnDestroy() {
    console.log('onDestroy is applied');
  }
}
Задание 1

ทดสอบการทำงานของทั้งสองฮุกบนเงื่อนไขปฏิกิริยา if

Задание 2

ทดสอบการทำงานของทั้งสองฮุกบนลูปปฏิกิริยา