I went around and around in circles with this problem yesterday. Today, it seems to work, and I think I know why. I was following the advice given in this stackOverflow answer https://stackoverflow.com/questions/47492475/no-provider-for-http-staticinjectorerror and I converted everything as suggested:
Update: Angular v6+
For Apps converted from older versions (Angular v2 – v5): HttpModule is now deprecated and you need to replace it with HttpClientModule or else you will get the error too.
In yourapp.module.tsreplaceimport { HttpModule } from '@angular/http';with the new HttpClientModuleimport { HttpClientModule} from "@angular/common/http";Note: Be sure to then update the modulesimports[]array by removing the oldHttpModuleand replacing it with the newHttpClientModule.
In any of your services that used HttpModule replaceimport { Http } from '@angular/http';with the new HttpClientimport { HttpClient } from '@angular/common/http';
Update how you handle your Http response. For example – If you have code that looks like thishttp.get('people.json').subscribe((res:Response) => this.people = res.json());
The above code example will result in an error. We no longer need to parse the response, because it already comes back as JSON in the config object.
The subscription callback copies the data fields into the component’s config object, which is data-bound in the component template for display.
For more information please see the – Angular HttpClientModule – Official Documentation
However, I couldn’t get it to work. This morning I was solving a different problem and I ended up changing the app.module.ts file and removing the HttpClientModule import. In the app.component.ts I kept the HttpClient import and in the class I used it as follows with updates to the pipe, map bit in the tutorial:
getUser(): Observable<any>{
return this.http.get('http://localhost:4200/api/user').pipe(
map(respnse => <string[]> respnse)
);
}
Now it works!!!!