热搜:前端 nest neovim nvim

angular生命周期的用法(angular2生命周期)

lxf2023-05-26 11:45:01

本文带您继续学习angular。当使用angular进行开发时,您不可避免地需要接触生命周期。让我们来谈谈angular中的生命周期。我希望它能帮助你!

angular生命周期的用法(angular2生命周期)

接触过 reactvue 开发的读者应该熟悉生命周期的概念。我们正在使用它。 angular 在开发过程中,是不可避免的。

组件从建立到销毁都经历了一系列的阶段。这是一个生命周期,与应用程序提供的阶段相对应 lifecycle hooks

那么,在 angular 中,这些 hooks 它们都是什么?了解它们,对你编写程序应该在哪里编写,非常重要。[相关教程推荐:“angular教程”

angular 生命周期执行顺序如下:

- constructor [常用,不算钩子函数,但非常重要]
- ngOnChanges【常用】
- ngOnInit【常用】
- ngDoCheck
  - ngAfterContentInit
  - ngAfterContentChecked
  - ngAfterViewInit【常用】
  - ngAfterViewChecked
- ngOnDestroy【常用】

为了解释和验证,我们使用它 angular-cli 生成一个 demo 项目。

constructor

es6 中的 class 初始化对象时,constructor 会立即被调用。

class Person {
  constructor(name) {
    console.log(