'No provider for Http' error when making GET request - Ionic 2

1

I have a Runtime Error with the method get of Http and I do not know why, who can help me thank you, the error is as follows:

  

Runtime Error Uncaught (in promise): Error: No provider for Http!   Error: No provider for Http! at injectionError   ( link ) at noProviderError   ( link ) at   ReflectiveInjector _. throwOrNull   ( link ) at   ReflectiveInjector . getByKeyDefault   ( link ) at   ReflectiveInjector . getByKey   ( link ) at   ReflectiveInjector .get ( link )   at AppModuleInjector.get (ng: ///AppModule/module.ngfactory.js: 220: 110)   at AppModuleInjector.getInternal   (ng: ///AppModule/module.ngfactory.js: 343: 54) at   AppModuleInjector.NgModuleInjector.get   ( link ) at resolveDep   ( link )

the codes are

src / providers / servi-products.ts

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

/*
  Generated class for the ServiProductos provider.

  See https://angular.io/docs/ts/latest/guide/dependency-injection.html
  for more info on providers and Angular 2 DI.
*/
@Injectable()
export class ServiProductos {

  constructor(public http: Http) {
    console.log('Hello ServiProductos Provider');
  }


  getMyJson(){
    this.http.get("assets/json/data.json").map(res => res.json()).subscribe(data => {
        console.log(data);
    });
  }

}

src / app / app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { Perfil } from '../pages/perfil/perfil';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { ServiProductos } from '../providers/servi-productos';

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    Perfil,
    ListPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp, {
      //backButtonText: 'Volver',
      iconMode: 'ios',
      modalEnter: 'modal-slide-in',
      modalLeave: 'modal-slide-out',
      tabsPlacement: 'bottom',
      pageTransition: 'ios-transition'
    }),
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    Perfil,
    ListPage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    ServiProductos,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

src / page / profile / profile.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { ServiProductos } from '../../providers/servi-productos';

/**
 * Generated class for the Perfil page.
 *
 * See http://ionicframework.com/docs/components/#navigation for more info
 * on Ionic pages and navigation.
 */
@IonicPage()
@Component({
  selector: 'page-perfil',
  templateUrl: 'perfil.html',
})
export class Perfil {
    login: {username?: string, password?: string} = {};
  submitted = false;

  constructor(public navCtrl: NavController, public navParams: NavParams, public serviProduct: ServiProductos) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad Perfil');
    this.serviProduct.getMyJson();
  }

}

src / assets / json / data.json

{
 // X contenido data.json
}
    
asked by Daniel Enrique Rodriguez Caste 24.05.2017 в 18:16
source

1 answer

1

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

    
answered by 14.06.2017 / 20:30
source