面试题：Angular中HttpClient模块如何设置请求头

导入HttpClientModule和HttpHeaders：在app.module.ts中导入HttpClientModule，使整个应用能够使用HttpClient服务。同时在发送请求的组件或服务中导入HttpHeaders用于创建请求头。

// app.module.ts
import { HttpClientModule } from '@angular/common/http';
// 其他导入...

@NgModule({
  imports: [
    // 其他模块...
    HttpClientModule
  ],
  // 其他配置...
})
export class AppModule {}

// 发送请求的组件或服务
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

创建请求头并设置Content - Type：使用HttpHeaders创建一个新的请求头对象，并设置Content - Type为application/json。

const headers = new HttpHeaders({
  'Content - Type': 'application/json'
});

发送HTTP请求并传入请求头：以发送POST请求为例，使用HttpClient的post方法，将请求头作为第三个参数传入。

@Injectable({
  providedIn: 'root'
})
export class YourService {
  constructor(private http: HttpClient) {}

  sendRequest(data: any) {
    const headers = new HttpHeaders({
      'Content - Type': 'application/json'
    });
    const url = 'your - api - url';
    return this.http.post(url, data, { headers });
  }
}

关键代码总结：

import { HttpClient, HttpHeaders } from '@angular/common/http';

// 创建请求头
const headers = new HttpHeaders({
  'Content - Type': 'application/json'
});

// 发送请求并传入请求头
this.http.post(url, data, { headers });

面试题：Angular中HttpClient模块如何设置请求头

知识考点

面试题答案