实现OnInit类的目的是什么，去掉ngOnInit就可以了？

Question

在 Angular 6 中，当我们创建一个组件时，该组件的 .ts 文件有一个实现 OnInit 类的类，但是当我们删除默认方法（ngOnInit）时，它可以正常工作。 所以我的问题是，如果它实现了某个类，那么它必须有一些必须在这个实现的类中实现的方法，如果不需要有方法，那么实现 OnInit 类的目的是什么。

Answer 1

ngOnInit

是 Angular 调用的生命周期钩子，表明 Angular 已完成创建组件。

我们导入

OnInit

以便使用它，实现

OnInit

不是强制性的，但被认为是良好的做法）：

import {Component, OnInit} from '@angular/core';

我们使用 ngOnInit 在组件创建后执行一些操作。例如，您可以在此处设置变量、调用方法等。

https://angular.io/api/core/OnInit

如果导入

OnInit

并执行

export class AppComponent implements OnInit

那么你必须添加

ngOnInit()

方法，否则会出现编译错误

Answer 2

正如@Patricio Vargas所说，如果你导出实现了

OnInit

接口的类组件，你需要实现

ngOnInit()

方法，否则你会得到错误

TS2420

（你当然可以尝试） stackblitz 只需在为 Angular 项目提供的默认 AppComponent 中实现 OnInit 接口即可。

关于第二点，即实现该接口的目的，您应该记住 Angular bootstrap 的第二阶段：

1. 组件树构建
2. 变化检测

使用

OnInit

钩子而不是在构造函数内部（必须用于 DI）初始化组件是一个很好的实践（有时需要），主要是因为构造函数调用是“Angular 组件树构造”的一部分，然后输入绑定在构造函数内将不可用（因为它们是检测更改阶段的一部分。

Answer 3

OnInit 不是一个类，而是框架提供的接口，因此如果您想在初始化组件时执行某些操作，您可以在类中提供 ngOnInit() 方法并在其中包含代码。有关 ngOnInt 的更多信息：https://angular.io/api/core/OnInit

如果您已经实现了 OnInit 接口，但没有提供 ngOnInit，您将在 VSCode 或其他编辑器抛出的代码中收到编译错误。

如下所示：

“ClaimComponent”类错误地实现了“OnInit”接口。 “GiftingClaimComponent”类型中缺少属性“ngOnInit”。

但是它会运行良好，因为最终 TS 代码会编译为 JavaScript。

由于 JavaScript 没有 TypeScript 中的类型安全或接口概念。但是，如果您尝试创建应用程序的 AOT 版本，它将失败，您必须提供实现。