使用ng g c创建Angular组件后缺失OnInit生命周期钩子的问题

为什么默认没有？ #

从Angular 14开始，CLI默认生成的组件不再包含OnInit生命周期钩子——这是因为多数简单组件不需要初始化逻辑，CLI做了精简，减少不必要的代码冗余。

给已创建的组件添加OnInit #

如果需要给现有组件补上OnInit，按这三步来：

1. 导入OnInit接口：

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

2. 让组件类实现该接口：

export class YourComponentComponent implements OnInit {

3. 实现ngOnInit方法：

ngOnInit(): void {
  // 在这里编写你的初始化逻辑
}

创建组件时自动生成OnInit #

如果希望每次新建组件都默认带OnInit，有两种方式：

1. 单次创建时指定参数：
   执行创建命令时加上--include-hooks=OnInit：

ng g c 'component-name' --include-hooks=OnInit

2. 全局修改默认配置：
   打开项目根目录的angular.json，找到schematics下的@schematics/angular:component节点，添加includeHooks配置：

"schematics": {
  "@schematics/angular:component": {
    "style": "css", // 保留你当前的样式配置
    "includeHooks": ["OnInit"]
  }
}

修改后，后续用ng g c创建的组件都会自动包含OnInit钩子。

内容的提问来源于stack exchange，提问作者Akhil K