Angular17执行ng new无app.module.ts，注入HttpClient报错无提供者

为什么没有 app.module.ts？ #

Angular 17 新项目默认采用**独立组件（Standalone Components）**模式，这种模式下不再需要传统的 app.module.ts 文件，所有配置直接在 main.ts 中完成，这是正常的默认行为，并非创建项目时遗漏。

解决 "No Provider for HttpClient" 错误 #

在独立组件模式下，需要显式为应用提供 HttpClient 的依赖，具体步骤如下：

1. 打开项目根目录下的 main.ts 文件
2. 导入 HttpClientModule 和 importProvidersFrom：

import { HttpClientModule } from '@angular/common/http';
import { importProvidersFrom } from '@angular/core';

3. 在 bootstrapApplication 的 providers 数组中添加配置：

bootstrapApplication(AppComponent, {
  providers: [
    importProvidersFrom(HttpClientModule)
  ]
})
.catch(err => console.error(err));

修改后的完整 main.ts 示例：

import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
import { HttpClientModule } from '@angular/common/http';
import { importProvidersFrom } from '@angular/core';

bootstrapApplication(AppComponent, {
  providers: [
    importProvidersFrom(HttpClientModule)
  ]
})
.catch(err => console.error(err));

这样配置后，HttpClient 就会被全局注册，你的 UserinfoService 就能正常注入 HttpClient 了。

另外，检查你的服务代码，存在两处小问题需要修正：

• observable 导入有误，应改为首字母大写的 Observable
• GetEmployees 方法的返回类型建议明确为 Observable<any>

修正后的服务代码：

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class UserinfoService {

  constructor(private htpsrvc : HttpClient) { }

  public GetEmployees() : Observable<any>
  {
    return this.htpsrvc.get("https://localhost:44387/api/Home");
  }
}

内容的提问来源于stack exchange，提问作者Srikanth Reddy