web-dev-qa-db-fra.com

Angular2 - HTTP RequestOptions HEADERS

J'ai actuellement un problème avec tslint et espérais que quelqu'un pourrait me diriger dans la bonne direction.

J'essaie d'envoyer une requête HTTP GET en utilisant HTTP fourni par le framework Angular2. Avec cette demande, je dois spécifier le type de contenu et le jeton d'authentification du support.

Exemple de mon code:

let headers = new Headers();
let authToken = this._user.getUser().JWT;
headers.append('Content-Type', 'application/json');
headers.append('Authorization', `Bearer ${authToken}`);
let options = new RequestOptions({ headers: headers });

this._http.get('http://' + url '/', options)
            .timeout(3000)
            .subscribe(
                (res) => {

Cela fonctionne, cependant, tslint se plaint que

"TS2345: l'argument de type '{en-têtes: en-têtes;}' n'est pas assignable au paramètre de type 'RequestOptionsArgs'. Les types de propriété 'en-têtes' sont incompatibles. Le type 'En-têtes' n'est pas assignable au type 'En-têtes'. Deux types différents existe avec ce nom, mais ils ne sont pas liés. La propriété 'clés' est manquante dans le type 'En-têtes' ".

J'apprécie le soutien.

angularhttptypescripttslint
72
Zander17

Mettre à jour

À ce jour, @angular/http a été obsolète , et @angular/common/http doit être utilisé à la place. La meilleure façon de travailler avec les en-têtes http est donc d'importer import { HttpHeaders } from '@angular/common/http'; ( documentation ).

Ancienne réponse

Le type Headers que vous êtes censé importer est import { Headers } from '@angular/http';.

Vérifiez vos importations

200
bviale

Vous devez mettre à jour les en-têtes en:

let headers =  {headers: new  HttpHeaders({ 'Content-Type': 'application/x-www-form-urlencoded'})};
8
Vivek Kapoor

Mise à jour pour Angular 5 

import { RequestOptions } from '@angular/http';

J'ai trouvé cela dans les commentaires de la bonne réponse, donc si cela aide quelqu'un, bonne chance.

Documentation: https://angular.io/api/http/RequestOptions

5
ValRob

// exemple d'en-têtes de type de contenu Json

import { Http, Headers, RequestOptions } from '@angular/http';

const Url = 'http://localhost:3000/';
const headers = new Headers;
const body = JSON.stringify({
title: "data" 
});
headers.append('Content-Type', 'application/json');
this.http.post(Url, body, { headers: headers })
.pipe(map((res => res)));
2
arul prince