No provider for Http! error in ionic

Ionic Framework ionic-v3
1

full error:

Runtime Error
Uncaught (in promise): Error: No provider for Http! Error at g (http://localhost:8100/build/polyfills.js:3:7133) at injectionError (http://localhost:8100/build/main.js:1511:86) at noProviderError (http://localhost:8100/build/main.js:1549:12) at ReflectiveInjector_.throwOrNull (http://localhost:8100/build/main.js:3051:19) at ReflectiveInjector.getByKeyDefault (http://localhost:8100/build/main.js:3090:25) at ReflectiveInjector.getByKey (http://localhost:8100/build/main.js:3022:25) at ReflectiveInjector.get (http://localhost:8100/build/main.js:2891:21) at AppModuleInjector.get (ng:///AppModule/module.ngfactory.js:272:103) at AppModuleInjector.getInternal (ng:///AppModule/module.ngfactory.js:505:51) at AppModuleInjector.NgModuleInjector.get (http://localhost:8100/build/main.js:3855:44) at resolveDep (http://localhost:8100/build/main.js:11260:45) at createClass (http://localhost:8100/build/main.js:11128:32) at createDirectiveInstance (http://localhost:8100/build/main.js:10954:37) at createViewNodes (http://localhost:8100/build/main.js:12303:49) at createRootView (http://localhost:8100/build/main.js:12208:5)

This is happening when i try to implement services i.e provider.

can anyone help real quick?

3 Likes
2

Providers have Http included by default, and in order to use Http in your app you will need to add the HttpModule to your app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ErrorHandler } from '@angular/core';
import { HttpModule } from '@angular/http';
...
  imports: [
    BrowserModule,
    HttpModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot()
  ],
...
78 Likes
4

the issue with my code was i was import http in my provider file which was not at all reuired in my app so i removed the import…and it solved the issue.

And if you are using import http…then you should import HttpModule in the app.module.ts it will solve the issue.

import { HttpModule } from '@angular/http'; 
....
imports:[..., HttpModule],..
8 Likes
5

Many thanking for you joshmorony :slight_smile:

6

Thanks You @joshmorony

7

thaaaannnnkkksssss :grin:

8

Gracias me sirvió mucho!

9

In Your youtube video "Loading Remote JSON DATA with HTTP in IONIC 2 no HttpModule in imports in app.module.ts: …

10

thanks bro…
thank q sooooo much…

11

Even after changing the import in app.module.ts I still receive the error. :confused:

@riteshbhat17

1 Like
12

can you provide the code which use have for the provider and app.module.ts here…

13

Do you run Ionic 2.0 or 3.0?

14

@riteshbhat17 Sure…

15

Yor app.module.ts should look like this in Ionic 3.X

...
import { HttpModule } from '@angular/http';

...
imports: [
  BrowserModule,
  HttpModule,
  IonicModule.forRoot(MyApp)
],

And then you can import the Http Module in your provider

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

You can follow my Ionic 3 guide here: Guide: How to update to Ionic 3.X

8 Likes
16

Component? Not module?

17

Ups :open_mouth: I changed it

18

Thanks You @joshmorony,

It’s work perfectly after added

import { HttpModule } from ‘@angular/http’;

and

imports: [
** BrowserModule,**
** HttpModule,**
** IonicModule.forRoot(MyApp),**
** IonicStorageModule.forRoot()**
** ],**

19

thanks for your solution, but after including httpModule am getting below error

Error: Encountered undefined provider! Usually this means you have a circular dependencies (might be caused by using ‘barrel’ index.ts files.

Please help me

20

Thanks, man, you saved my day!

21

Very Good! Congratulations, all likes the your posts.