web-dev-qa-db-fra.com

Le type 'En-têtes' n'a pas de propriétés en commun avec le type 'RequestOptionsArgs'?

Je viens de faire deux mises à jour importantes de notre application et outils de compilation Angular 4):

  1. @ angular/core^4.1.3 => ^4.2.4 (et/http,/forms, etc.)
  2. tslint^5.3.2 => ^5.4.3

J'ai un service qui déclare des options comme ceci:

@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 ... */
}

Ce qui précède ne valide plus tslint et génère l'erreur suivante:

erreur TS2559: Le type 'En-têtes' n'a aucune propriété en commun avec le type 'RequestOptionsArgs'.

La source (@ angular/http interface.d.ts:43) autorise clairement Headers en tant que 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;
}
19
msanford

Mise à jour pour 4.3 HttpClient

La nouvelle syntaxe compatible avec HttpClient , introduite dans angular 4.3, est la suivante:

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

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

Pas plus RequestOptions: paramètres sont ajoutés en utilisant la nouvelle carte immuable HttpParams Map.

Avant 4.3/Http

J'ai juste remarqué que RequestOptions exige maintenant que vous passiez explicitement les options nommées en tant qu'objet, comme:

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