WEB - 拿图看懂Angular生命周期


前言

为了更简单明了的记住Angular的生命周期,特意整理一张图

红色的被调用一次,绿色的会被调用多次。
这里分为了三个阶段,组件初始化阶段,变化检测,组件销毁。
会在组件初始化后看到组件,在变化检测阶段让属性值和页面展示保持一致。
变化检测中的四个方法和组件初始化中的四个方法是一样的。
一共只有9个方法。

1.首先会调用构造函数

  • ngOnChanges:当一个父组件修改或初始化一个子组件的输入属性的时候被调用
  • ngOnInit:初始化(如果初始化的逻辑需要依赖输入属性,那就一定要写在ngOnInit中,而不要写在构造函数中)
  • ngDoCheck:用来检测
  • ngAfterContentInit:
  • ngAfterContentChecked:
  • ngAfterViewInit
  • ngAfterViewChecked
  • ngDoCheck
  • ngAfterContentChecked
  • ngAfterViewChecked

待续…