在Angular中,组件的生命周期钩子主要包括以下几个:
- ngOnChanges():当Angular(再次)检测到数据绑定输入属性的值发生变化时调用。该方法接收一个SimpleChanges对象,其中包含当前和上一个属性值的详细信息。需要注意的是,ngOnChanges() 仅在每个输入属性的值发生变化时调用,而不会在首次接收到输入属性值时分发。如果你需要在Angular首次设置输入属性值后执行某项操作,请使用ngOnInit() 生命周期钩子。
- ngOnInit():在Angular第一次显示数据绑定和首次调用ngOnChanges()之后,初始化指令/组件。这是使用指令和组件时最常见的钩子。在大多数情况下,用于在组件初始化阶段执行如启动定时器,发送HTTP请求等复杂的业务逻辑。
- ngDoCheck():Angular每次检测到数据绑定输入属性的值可能发生变化时调用。在此方法中执行自定义变更检测逻辑。实际上,Angular会在每个检测周期中调用它,紧跟在ngOnChanges()和首次执行ngOnInit()后面。
- ngAfterContentInit():当Angular把外部内容投影进组件视图或指令所在的视图之后调用。第一次ngDoCheck()之后调用,且只调用一次。
- ngAfterContentChecked():每次完成被投影组件内容的变更检测之后调用。ngAfterContentInit()和每次ngDoCheck()之后调用。
- ngAfterViewInit():当Angular初始化完组件视图及其子视图或包含该指令的视图之后调用。第一次ngAfterContentChecked()之后调用,且只调用一次。此时,组件的DOM已经构建完成,可以执行一些依赖于DOM的操作,如通过ViewChild查询元素等。
- ngAfterViewChecked():每次做完组件视图和子视图的变更检测之后调用。ngAfterViewInit()和每次ngAfterContentChecked()之后调用。
- ngOnDestroy():当Angular每次销毁指令/组件之前调用并清扫。在这儿反订阅可观察对象和分离事件处理器,以防内存泄露。在大多数情况下,用于执行清理操作,如取消订阅服务、清除定时器等。
这些生命周期钩子可以帮助你更好地管理和控制组件在创建、更新和销毁过程中的行为。