Angular 角形生命周期钩

我画了一个草图，表示组件生命周期的流程

使用

完成关于生命周期挂钩的内容后
我画了这个草图。 现在这是组件中生命周期挂钩的正确顺序了吗？

ngochanges（）

不是在

构造函数之后调用的，而是在运行更改检测并更新了
@Input（）
之后调用的
当运行更改检测时，也会调用
ngDoCheck（）
。

在第一次调用
ngOnChanges（）
后调用
ngOnInit（）

另请参见
以下是我从文档中了解到的内容。这可能对你有帮助。
您提供的草图有点正确。为了便于参考，我尝试实现了每个钩子。为了确定它们的发生点，我将它们记录到控制台

以下是我的控制台截图，供您参考，我允许我的应用程序逐个加载并遵循每个生命周期


这是第一次加载页面时的控制台

因此，在此生命周期中被称为组件的组件有其自身的功能：

1） 构造函数：实例化类时调用的默认方法

2） ngOnChanges：在创建新组件时执行，当@Input的绑定属性之一发生更改时，它也是调用参数时唯一接受参数的钩子，该参数称为SimpleChanges

3） ngOnInit：组件初始化后调用。这不允许组件在DOM上可见。这将在构造函数之后运行

4） ngDoCheck：在运行更改检测时运行。如果没有更改，即使只是发生了一个事件，它也会运行，以确保是否有更改。（例如：它将在按钮点击事件之后运行，而不管它是否正在进行ant更改）
5） ngAfterContentInit：将内容（ng内容）投影到视图中后调用

6） ngAfterContentChecked：在检查每个投影内容后调用该函数

7） ngAfterViewInit：在组件视图（和子视图）初始化后调用

8） nAfterViewChecked：每次检查视图（和子视图）时调用

在下图中，当我单击左上角的链接“菜谱簿”导航栏标题时，查找控制台：


我们可以清楚地看到，调用“ngDoCheck”之后是“ngAfterContentChecked”，最后是“ngViewChecked”。如果注意到“ngAfterContentInit”和“ngViewInit”仅在内容最终投影到视图时才在开始时调用。它们与发生的相应变化无关

9） ngondestory：当我们通常使用if条件并相应地渲染组件时调用。这主要是在物体被角度物体破坏之前

请参考下图，查找当我单击“销毁第一个组件”按钮时消失的配方信息卡之一：


这里称为“Ngondestry”，后面跟着“ngDoCheck”和其他钩子。这将使循环再次被调用，但随后被破坏的内容将无法呈现。（仅供参考，这里我刚刚使用了拼接方法来销毁其中一个渲染内容）

如果需要，我也可以提供代码，希望这可以帮助您以及其他人了解生命周期挂钩在应用程序中的功能。：）

另外，请忽略该页面屏幕截图上的其余元素。
ngOnChanges（）在“@Input”更改时被调用，在构造函数执行后，Angular设置“@Input”数据，这意味着触发ngOnChanges（）。我认为这是误导。在零部件创建零部件后，对零部件执行角度变化检测。如果存在输入绑定，它们将被更新，因此将调用
ngOnChanges（）
ngOnChanges（）
与构造函数无关。确切地说，它与构造函数无关，但执行顺序将是构造函数，一旦更改，则仅当您只对纯粹的及时顺序感兴趣时，那么是的，但我认为这样记住它不是一个好主意。我更喜欢理解而不仅仅是记忆。但是每个人都有自己的方式，因此这只是我的观点。如果组件中没有
@Input（）
s，那么就不应该调用
ngochanges（）
（虽然我自己还没有验证）。文档有什么不清楚的地方吗？不，先生，文档太棒了，但我只需要验证我对提升周期挂钩的理解。它不是来自Maximilian Schwarzmüller配方项目吗：完全正确！配方项目：D这个例子没有解释要点，这就是为什么叫它，为什么？？？为什么它有用，什么时候确切地使用它？？您好@ieXcept，您在哪里看到Raed Khalaf先生询问为什么以及何时需要调用生命周期挂钩？他的意图是验证他提供的草图是否正确。这就是我在回答中所说的所有理解和截图。至于您的问题，何时调用这些完全取决于“您的”用例。我建议你完全了解这些挂钩。这可能会帮助你自己回答问题。谢谢！：）