angular http

// import { HttpModule } from '@angular/http';  // this is going to be replaced with this:
import { HttpClientModule } from '@angular/common/http';

import { HttpClientModule }    from '@angular/common/http';
...
@NgModule({
  imports: [
    HttpClientModule,
  ],
})    

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

@Injectable()
export class ConfigService {
  constructor(private http: HttpClient) { }
}

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

@Injectable()
export class ConfigService {
  constructor(private http: HttpClient) { }
  
  httpPost(data) {
	return this.http.post(endpoint,data);
  }
}

http
  .get<MyJsonData>('/data.json', {observe: 'response'})
  .subscribe(resp => {
    // Here, resp is of type HttpResponse<MyJsonData>.
    // You can inspect its headers:
    console.log(resp.headers.get('X-Custom-Header'));
    // And access the body directly, which is typed as MyJsonData as requested.
    console.log(resp.body.someField);
  });

Here how the request flow while executing angular app:
main.ts  >>   app.Module.ts  >>  app.component.ts  >>  index.html  >>  app.component.html