Angular - Headers for request post

Question

I have a problem with the headers of my request post I want to add a project with name and description but when I try to post my form I have this error:

Argument of type 'RequestOptions' is not assignable to parameter of type '{ headers?: HttpHeaders | { [header: string]: string | string[]; }; observe?: "body"; params?: Ht...'. Types of property 'headers' are incompatible. Type 'Headers' is not assignable to type 'HttpHeaders | { [header: string]: string | string[]; }'. Type 'Headers' is not assignable to type '{ [header: string]: string | string[]; }'. Index signature is missing in type 'Headers'.

And in my console i have this : 401 (Unauthorized)

The code for this (all is good but this part nop) :

addProject(token: string, id: number, nom: string, capteurs): Observable<ProjetModel> {    
  const headers = new Headers({'X-Auth-Token': token});
  const body = { nom, capteurs };
  const options = new RequestOptions({ headers: headers });
  return this.http.post(`${environment.baseUrl}/projets`, body, options).map((response: Response) => response.json());
}

Thanks,

Looks like you are mixing deprecated http and new httpClient module — David
That'd be better since the other one will be removed eventually — David

Anto Antony Anto Antony · Accepted Answer · 2018-04-10T18:23:37

Try to add the headers as follows

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

     @Injectable()
     export class ServiceName {

        constructor(private http: HttpClient) { }

        addProject(token: string, id: number, nom: string, capteurs): Observable<ProjetModel> {    

           const httpOptions = {
             headers: new HttpHeaders({
               'Authorization': 'my-auth-token'
             })
           };

           return this.http.post(`${environment.baseUrl}/projets`, body, httpOptions ).map((response: Response) => response.json());
        }
    }

Angular - Headers for request post

2 Answers