Angular执行ng serve报NG8002错误：form无法绑定formGroup，求排查

问题根源 #

1. 服务注入方式错误：你在app.component.ts的cambiarFondo方法里直接调用inject(FondoService)，但inject()只能在构造函数、字段初始化器这类注入上下文里使用，普通方法不属于注入上下文，因此触发报错。
2. 服务未在模块注册：FondoService没添加到app.module.ts的providers数组中，Angular无法创建该服务的实例。

具体修正步骤 #

1. 调整组件的服务注入方式 #

修改app.component.ts，通过构造函数注入服务，替代方法内的inject()调用：

import { Component } from '@angular/core';
import { FondoService } from './fondo.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor(private fondoService: FondoService) {}

  cambiarFondo() {
    this.fondoService.cambiarColor();
  }
}

2. 在模块中注册服务 #

修改app.module.ts，把FondoService加入providers数组：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { FondoService } from './fondo.service';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [FondoService], // 注册服务
  bootstrap: [AppComponent]
})
export class AppModule { }

3. 确认服务代码正确性 #

确保fondo.service.ts的@Injectable()装饰器和方法逻辑正常：

import { Injectable } from '@angular/core';

@Injectable()
export class FondoService {
  cambiarColor() {
    // 这里写你的背景色修改逻辑，比如：
    document.body.style.backgroundColor = '#eef';
  }
}

完成以上修改后，重新运行ng serve即可正常启动项目。

内容的提问来源于stack exchange，提问作者Juan Guillermo Rozo Chicue