No provider for ConnectionBackend for ionic 2

Question

im using ionic 2 and i create a simple service

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';

@Injectable()
export class EliteApi {

  private baseUrl="https://myurl.com";
    constructor(private http:Http) { }

    getTournaments(){
      return new Promise(resolve =>{
        this.http.get(this.baseUrl + 'tournaments.json').subscribe(res => resolve(res.json()));

      });
    }
}

then i import it on app.component.ts like this to register the service

import { EliteApi } from './shared/shared';
import {Http} from "@angular/http";

@Component({
  templateUrl: 'app.html',
  providers: [EliteApi,Http]
})

after that on my page i import the service

import { EliteApi } from '../../app/shared/shared';

and on the event loaded i wrote this to get the json data

  ionViewLoaded(){
    this.eliteApi.getTournaments().then(data => this.tournaments = data);
  }

it gives me exception says No provider for ConnectionBackend!

i tried as some question similar here says put the service on providers as this

@NgModule({ providers: [ EliteApi

but also the same error

Answer 1

Have you import the HttpModule in your App module?

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

@NgModule({
   imports: [HttpModule]
})

Answer 2

the problem solved when I type my code in the event ionViewWillLoad or ionViewDidLoad not ionViewLoaded

also the code works fine when I import HttpModule on app.component.ts

import { HttpModule} from "@angular/http";

and add it to providers like this

  providers: [EliteApi,HttpModule]

Answer 3

您还需要在使用之前在构造函数中注入服务，如下所示：

constructor(public eliteApi:EliteApi){ }