Angular HttpClient Get Request Broken

Ionic Framework ionic-v3
1

I’ve been trying to use the HttpClient module and I’m not sure what’s going on but no matter what I do it seems to be broken, I’m consider going back to the ionic native HTTP but my issue with that is that when ever i user a post request with a header the app crashes.

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { UserProvider } from '../user/user';
import 'rxjs/add/operator/map';


/*
  Generated class for the EmployeeProvider provider.
, HttpParams, HttpHeaders
  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/
@Injectable()
export class EmployeeProvider {
  private apiUrl = 'https://*****.azurewebsites.net/';
  //Employees for the userID
  employees: any;

  constructor(private http: HttpClient, public user: UserProvider) {
    this.employees = [];
    this.getEmployeeByUserID();
  }
  getEmployees(){
  this.http.get(`${this.apiUrl}employees`).map(res => res.json()).subscribe(data => {
    this.employees = data.data.children;
    console.log(this.employees);
  })
  }
  
}

When I tried the following:

  getEmployees(){
    return this.http.get(`${this.apiUrl}employees`)
    }

the stringified JSON that i got looked like this:


 {"_isScalar":false,"source":{"_isScalar":false,"source":{"_isScalar":false,"source":{"_isScalar":true,"value":{"url":"https://****.azurewebsites.net/employees/","body":null,"reportProgress":false,"withCredentials":false,"responseType":"json","method":"GET","headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"params":{"updates":null,"cloneFrom":null,"encoder":{},"map":null},"urlWithParams":"https://*****.azurewebsites.net/employees/"},"scheduler":null},"operator":{"concurrent":1}},"operator":{}},"operator":{}}

The JSON on the server looks like this:

[
    {
        "employeeID": "7FEC7906-E826-4ACA-B6EA-D835CCDB5972",
        "employerID": "453A528B-CB3F-40FF-8BFA-7E5E6356BDFE",
        "userID": "1EF1B06E-0BEC-46B2-946F-A1BC6D4F60D9",
        "wage": 15,
        "internalID": null,
        "unpaidHours": 0.21944444444444441,
        "unpaidWages": 3.291666666666666
    },
    {
        "employeeID": "312D6219-53D0-42A2-A1DF-FB525CB32987",
        "employerID": "453A528B-CB3F-40FF-8BFA-7E5E6356BDFE",
        "userID": "641B65A3-4D5E-4B37-AA80-B906F9C90CCC",
        "wage": 15,
        "internalID": null,
        "unpaidHours": 0.03888888888888889,
        "unpaidWages": 0.5833333333333334
    }
]
2

Hi , just change .map with .subscribe