Does the Headers type have no common properties with the RequestOptionsArgs type?

Question

I just made two important updates to our Angular 4 applications and builds:

• @ angular / core ^4.1.3 => ^4.2.4 (and / http, / forms, etc.)
• tslint ^5.3.2 => ^5.4.3

I have a Service that declares the following parameters:

 @Injectable() export class WorkOrderService { private headers: Headers = new Headers({ 'Content-Type': 'application/json' }); private options: RequestOptions = new RequestOptions(this.headers); constructor(private http: Http) {} /* Methods ... */ } 

The above no longer checks tslint, causing the following error:

error TS2559: The Headers type has no common properties with the RequestOptionsArgs type.

The source (@ angular / http interface.d.ts:43 ) explicitly allows Headers as RequestOptionsArgs :

 /** * Interface for options to construct a RequestOptions, based on * [RequestInit](https://fetch.spec.whatwg.org/#requestinit) from the Fetch spec. * * @experimental */ export interface RequestOptionsArgs { url?: string | null; method?: string | RequestMethod | null; /** @deprecated from 4.0.0. Use params instead. */ search?: string | URLSearchParams | { [key: string]: any | any[]; } | null; params?: string | URLSearchParams | { [key: string]: any | any[]; } | null; headers?: Headers | null; body?: any; withCredentials?: boolean | null; responseType?: ResponseContentType | null; } 

Answer 1

Update for 4.3 HttpClient

New HttpClient compatible syntax introduced in angular 4.3:

 import { HttpClient, HttpHeaders } from "@angular/common/http"; private _options = { headers: new HttpHeaders({ 'Content-Type': 'application/json' }) }; 

More RequestOptions : parameters are added using the new immutable HttpParams map.

Pre 4.3 / Http

I just noticed that RequestOptions now requires that explicitly pass named parameters as an object, for example:

 headers: Headers = new Headers({ 'Content-Type': 'application/json' }); options: RequestOptions = new RequestOptions({ headers: this.headers });