HttpModule correctly imported but still -> Uncaught (in promise): Error: No provider for ConnectionBackend!

Not sure if I’m still missing something but pretty sure I’m correctly importing HttpModule:

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { IonicStorageModule } from '@ionic/storage';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { MyApp } from './app.component';
import { CredentialsProvider } from '../providers/credentials/credentials';
import { ApiProvider } from '../providers/api/api';
import { BasePage } from '../pages/base';

@NgModule({
  declarations: [
    MyApp,
    BasePage
  ],
  imports: [
    BrowserModule,
    HttpModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot()
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    CredentialsProvider,
    ApiProvider
  ]
})
export class AppModule { }

api.ts

import { CredentialsProvider } from '../credentials/credentials';
import { Observable } from 'rxjs/Observable';
import { Injectable } from '@angular/core';
import {
  Http,
  ConnectionBackend,
  RequestOptions,
  RequestOptionsArgs,
  Response,
  Headers
} from '@angular/http';

@Injectable()
export class ApiProvider extends Http {

  private authHeader: string;

  constructor(
    public backend: ConnectionBackend,
    public requestOpts: RequestOptions,
    private credentialsProvider: CredentialsProvider
  ) {
    super(backend, requestOpts);

    credentialsProvider.getStoredCredentials().then((val: string) => {
      this.authHeader = val;
    });

    console.log('Hello ApiServiceProvider Provider');
  }

  request(url: string, options: RequestOptionsArgs): Observable<Response> {
    this.setContentTypeHeader(options.headers); // TODO: May neet to add case-by-case
    return super.request(this.credentialsProvider.environment.api + url, options);
  }
  
  private setContentTypeHeader(headers: Headers): void {
    headers.set('Content-Type', 'application/json');
  }

}

If you don’t get any better answers, I would ditch inheritance for composition/delegation.

Sounds good, thanks for the suggestion.