CODEWITHSUNDEEP
angularrxjsangular-httpclient
Jose
Jose

Reputation: 1819

Header in get. Angular 6

I'm doing an example that I've taken from this same web, but I do not know what I'm doing wrong that gives me an error, and even though I look at it I do not see what I'm doing wrong.

When doing "response => response.json()" I get the following error:

The json property does not exist in the Object type

My service is as follows:

import { Injectable } from '@angular/core';
import { HttpHeaders,HttpClient  } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class CompetenceService {

  public url: string;

  constructor(private httpCliente: HttpClient) {}

  public createUser(): Observable < any > {
    const getHeaders: HttpHeaders = new HttpHeaders({
      'Content-Type': 'application/json'
    });
    return this.httpCliente
      .get('http://xxx/xxx/xxx', {
        headers: getHeaders
      }).pipe(
        map(
          response => response.json() < --error: The 'json'
          property does not exist in the 'Object'
          type
        )
      );
  }
}

Someone sees that I am doing wrong.

Upvotes: 0

Views: 720

Answers (1)

SiddAjmera
SiddAjmera

Reputation: 39432

You don't need to map it as you're using HttpClient. It is only required in case you're using Http from @angular/http

HttpClient gives you the actual Response Data. So you don't have to call json on the response to get the actual data as you had to do in case of using Http. And if you do, since there won't be a method named json on the response data, it will throw an error. And that's what it has done.

Get rid of it and you should just be fine.

import { Injectable } from '@angular/core';
import { HttpHeaders, HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class CompetenceService {

  public url: string;

  constructor(private httpCliente: HttpClient) {}

  public createUser(): Observable < any > {
    const getHeaders: HttpHeaders = new HttpHeaders({
      'Content-Type': 'application/json'
    });
    return this.httpCliente
      .get('http://xxx/xxx/xxx', {
        headers: getHeaders
      });
  }
}

Upvotes: 1

Related Questions