Angular 4中HttpClient Delete带Body报错：RequestHeaders不存在于RequestOptionArgs

Hey there, let's get this sorted out quickly! The issue you're hitting comes from mixing up the old Http module APIs with the newer HttpClient module in Angular 4. Here's what's wrong and how to fix it:

What's Causing the Error? #

1. Wrong Option Type: You're using RequestOptions (from the old @angular/http module) with HttpClient (from @angular/common/http). The HttpClient expects an HttpOptions object instead, which uses different property names.
2. Incorrect Property Name: You passed reqHeaders to the options object, but the valid property name for headers in HttpOptions is just headers.
3. Unnecessary JSON Parsing: The HttpClient automatically parses JSON responses for you, so that map(rez => JSON.parse(rez)) line is redundant.

Corrected Code #

First, make sure you're importing the right classes from @angular/common/http:

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

Then update your method like this:

myMethod(id: string, reason: string): Observable<any> { 
  // Create HttpHeaders (instead of the old Headers class)
  const httpHeaders = new HttpHeaders({ 'Content-Type': 'application/json' }); 
  // Use a plain object for the body - HttpClient will serialize it to JSON automatically
  const body = { reqId: id, reqReason: reason }; 

  return this.httpClient.delete( 
    `http://localhost:188/.../1677777555`, 
    { headers: httpHeaders, body: body } // HttpOptions object with correct property names
  );
  // You can keep your .catch(error => ...) block here for error handling
}

Extra Notes #

• If you were originally using the old Http module (not HttpClient), you could use RequestOptions, but HttpClient is the recommended approach in Angular 4+ for better performance and automatic JSON handling.
• By passing a plain object as the body instead of a template string, you avoid potential syntax errors and make the code cleaner.

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