EXCEPTION: No provider for Http! How to solve?

@victorcarvalhosp wrote:

Hello guys! I'm developing one app with ionic 2, but I'm stucked with this error when I try to make an http request... And I don't know what is causing it...

Look at my js:

app.js

import {App, IonicApp, Platform, Modal} from 'ionic/ionic';
import { LoginPage } from './login-page/loginPage';
import { VamosComecarPage } from './vamos-comecar/vamos-comecar';
import { SplashPage } from './splash/splash';
import { NotificacoesUsuarioPage } from './notificacoes-usuario/notificacoes-usuario';
import { CalendarioEventosPage } from './calendario-eventos/calendario-eventos';

@App({
template: '<ion-nav [root]="root"></ion-nav>',
providers: [App]
})

class MyApp {
constructor(app: App, ionicApp: IonicApp, platform: Platform, modal: Modal) {
	this.app = app;
	this.platform = platform;

	this.initializeApp();

	this.root = SplashPage;
}

initializeApp() {
	this.platform.ready().then(() => {
  		console.log('Platform ready');
	});
}
}

cadastro.js:

import { Page, Modal, NavController } from 'ionic/ionic';
import { VamosComecarPage } from '../vamos-comecar/vamos-comecar';
import { ConfirmacaoCadastroModal } from '../modal-confirmacao-cadastro/modal-confirmacao-cadastro';
import {Component, CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/angular2';
import { Student } from '../common/student';
import {Http, Headers, HTTP_PROVIDERS} from 'angular2/http';


@Page({
templateUrl: 'app/cadastro/cadastro.html',
})

export class CadastroPage {
model = new Student('', '', '');

constructor( nav: NavController, modal: Modal, http: Http ) {
	this.nav = nav;
	this.modal = modal;
	this.http = http;
}

onSubmit(){
	console.log('CHAMOU SUBMIT ' + this.model.name);
	this.http.get('http://jsonplaceholder.typicode.com/posts/1')
  .map(res => res.json())
  .subscribe(data => {
  console.log(data)
  });

getRandomQuote() {
  this.http.get('http://jsonplaceholder.typicode.com/posts/1')
  .map(res => res.json())
  .subscribe(data => {
 console.log(data)
 });

showModal() {
	this.modal.open( ConfirmacaoCadastroModal );
}

get diagnostic() { return JSON.stringify(this.model); }
}

The error occours when I try to acces the cadastro.html page...

Look the stacktrace:

EXCEPTION: No provider for Http! (CadastroPage -> Http)
app.bundle.js:48505 EXCEPTION: No provider for Http! (CadastroPage -> Http)BrowserDomAdapter.logError @ app.bundle.js:48505BrowserDomAdapter.logGroup @ app.bundle.js:48515ExceptionHandler.call @ app.bundle.js:26307(anonymous function) @ app.bundle.js:49587NgZone._notifyOnError @ app.bundle.js:40195errorHandling.onError @ app.bundle.js:40093run @ app.bundle.js:3587(anonymous function) @ app.bundle.js:40108zoneBoundFn @ app.bundle.js:3557promiseReactionJob @ app.bundle.js:1930(anonymous function) @ app.bundle.js:1943Item.run @ app.bundle.js:3434drainQueue @ app.bundle.js:3404cb @ app.bundle.js:40166arguments.(anonymous function) @ app.bundle.js:4084(anonymous function) @ app.bundle.js:3564run @ app.bundle.js:3584(anonymous function) @ app.bundle.js:40108zoneBoundFn @ app.bundle.js:3557
app.bundle.js:48505 STACKTRACE:BrowserDomAdapter.logError @ app.bundle.js:48505ExceptionHandler.call @ app.bundle.js:26309(anonymous function) @ app.bundle.js:49587NgZone._notifyOnError @ app.bundle.js:40195errorHandling.onError @ app.bundle.js:40093run @ app.bundle.js:3587(anonymous function) @ app.bundle.js:40108zoneBoundFn @ app.bundle.js:3557promiseReactionJob @ app.bundle.js:1930(anonymous function) @ app.bundle.js:1943Item.run @ app.bundle.js:3434drainQueue @ app.bundle.js:3404cb @ app.bundle.js:40166arguments.(anonymous function) @ app.bundle.js:4084(anonymous function) @ app.bundle.js:3564run @ app.bundle.js:3584(anonymous function) @ app.bundle.js:40108zoneBoundFn @ app.bundle.js:3557
app.bundle.js:48505 Error: DI Exception
at NoProviderError.BaseException [as constructor] (app.bundle.js:26188)
at NoProviderError.AbstractProviderError [as constructor] (app.bundle.js:26870)
at new NoProviderError (app.bundle.js:26906)
at Injector._throwOrNull (app.bundle.js:25235)
at Injector._getByKeyDefault (app.bundle.js:25286)
at Injector._getByKey (app.bundle.js:25226)
at Injector._getByDependency (app.bundle.js:25212)
at Injector._instantiate (app.bundle.js:25106)
at Injector._instantiateProvider (app.bundle.js:25095)
at Injector._new (app.bundle.js:25084)

What I'm doing wrong?

Thanks!

Posts: 1

Participants: 1

Read full topic