Cannot find the '@angular/common/http' module Cannot find the '@angular/common/http' module angular angular

Cannot find the '@angular/common/http' module


Important: HttpClientModule is for Angular 4.3.0 and above. Check @Maximus' comments and @Pengyy's answer for more info.


Original answer:

You need to inject HttpClient in your component/service not the module. If you import HttpClientModule in your @NgModule

// app.module.ts: import {NgModule} from '@angular/core';import {BrowserModule} from '@angular/platform-browser'; // Import HttpClientModule from @angular/common/httpimport {HttpClientModule} from '@angular/common/http'; @NgModule({  imports: [    BrowserModule,    // Include it under 'imports' in your application module    // after BrowserModule.    HttpClientModule,  ],})export class MyAppModule {}

So change

constructor(private httpClient: HttpModule) {}

to

constructor(private httpClient: HttpClient) {}

as it's been written in the documentation


However, since you imported the HttpModule

you need to inject constructor(private httpClient: Http) as @Maximus stated in the comments and @Pengyy in this answer.

And for more info on differences between HttpModule and HttpClientModule, check this answer


Important Update:

HttpModule and Http from @angular/http has been deprecated since Angular V5, should of using HttpClientModule and HttpClient from @angular/common/http instead, refer CHANGELOG.


For Angular version previous from **@4.3.0, You should inject Http from @angular/http, and HttpModule is for importing at your NgModule's import array.

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

Inject http at component or service

import { Http } from '@angular/http';constructor(private http: Http) {}

For Angular version after(include) 4.3.0, you can use HttpClient from @angular/common/http instead of Http from @angular/http. Don't forget to import HttpClientModule at your NgModule's import array first.

Refer @echonax's answer.


note: This is for @angular/http, not the asked @angular/common/http!

Just import in this way, WORKS perfectly:

// Import HttpModule from @angular/httpimport {HttpModule} from '@angular/http';@NgModule({  declarations: [    MyApp,    HelloIonicPage,    ItemDetailsPage,    ListPage  ],  imports: [    BrowserModule,    HttpModule,    IonicModule.forRoot(MyApp),  ],  bootstrap: [...],  entryComponents: [...],  providers: [... ]})

and then you contruct in the service.ts like this:

constructor(private http: Http) { }getmyClass(): Promise<myClass[]> {  return this.http.get(URL)             .toPromise()             .then(response => response.json().data as myClass[])             .catch(this.handleError);}