Help on Error using Provider (with example)

Ionic Framework ionic-v3
1

I wanted top create a provider which stores some variables I can be used/changed by other components.
I created the provider with ionic generate provider and in the providers/global-var.ts:

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class GlobalVar {
    somevariable: any = "hi";
    constructor(public http: Http) {
        console.log('Hello GlobalVarProvider Provider');
    }

}

added these lines on app.module:

import { GlobalVar } from '../providers/global-var/global-var';

// and inside NgModle added to providers

@NgModule({

  providers: [
    GlobalVar
  ]

})

In some component I tried to get the variable from provider:


import { GlobalVar } from '../../providers/global-var/global-var';
@Component({
    providers: [GlobalVar],
    template: `some code  `
})

export class SomeClass{

    constructor(private navParams: NavParams, public globalVar: GlobalVar) {}
    localvariable : any = globalVar.somevariable;
    

}

I got error:

Runtime Error
Uncaught (in promise): Error: No provider for Http! Error: No provider for Http! at injectionError (http://localhost:8100/build/main.js:1509:86) at noProviderError (http://localhost:8100/build/main.js:1547:12) at ReflectiveInjector_._throwOrNull (http://localhost:8100/build/main.js:3048:19) at ReflectiveInjector_._getByKeyDefault (http://localhost:8100/build/main.js:3087:25) at ReflectiveInjector_._getByKey (http://localhost:8100/build/main.js:3019:25) at ReflectiveInjector_.get (http://localhost:8100/build/main.js:2888:21) at AppModuleInjector.NgModuleInjector.get (http://localhost:8100/build/main.js:3856:52) at resolveDep (http://localhost:8100/build/main.js:11317:45) at createClass (http://localhost:8100/build/main.js:11170:35) at _createProviderInstance (http://localhost:8100/build/main.js:11140:26)
Stack
Error: Uncaught (in promise): Error: No provider for Http!
Error: No provider for Http!
    at injectionError (http://localhost:8100/build/main.js:1509:86)
    at noProviderError (http://localhost:8100/build/main.js:1547:12)
    at ReflectiveInjector_._throwOrNull (http://localhost:8100/build/main.js:3048:19)
    at ReflectiveInjector_._getByKeyDefault (http://localhost:8100/build/main.js:3087:25)
    at ReflectiveInjector_._getByKey (http://localhost:8100/build/main.js:3019:25)
    at ReflectiveInjector_.get (http://localhost:8100/build/main.js:2888:21)
    at AppModuleInjector.NgModuleInjector.get (http://localhost:8100/build/main.js:3856:52)
    at resolveDep (http://localhost:8100/build/main.js:11317:45)
    at createClass (http://localhost:8100/build/main.js:11170:35)
    at _createProviderInstance (http://localhost:8100/build/main.js:11140:26)
    at c (http://localhost:8100/build/polyfills.js:3:13190)
    at Object.reject (http://localhost:8100/build/polyfills.js:3:12546)
    at OverlayPortal.NavControllerBase._fireError (http://localhost:8100/build/main.js:44151:16)
    at OverlayPortal.NavControllerBase._failed (http://localhost:8100/build/main.js:44139:14)
    at http://localhost:8100/build/main.js:44194:59
    at t.invoke (http://localhost:8100/build/polyfills.js:3:8971)
    at Object.onInvoke (http://localhost:8100/build/main.js:4427:37)
    at t.invoke (http://localhost:8100/build/polyfills.js:3:8911)
    at r.run (http://localhost:8100/build/polyfills.js:3:4140)
    at http://localhost:8100/build/polyfills.js:3:13731

What exactly did I do wrong? http??

2

OK I solve this code by adding httpModlue in app.module.ts.

But I do appreciate if someone explain why.
And perhaps in future it should be done by the CLI when generating a provider??

3

Http is used in youe new provider, but wasn’t provided anywhere yet.

If default generated providers use Http, this could be a bug.
Create an issue at Issues · ionic-team/ionic-cli · GitHub