Hi Guys, I am creating an firebase and ionic chat application. I am getting an error "runtime error uncaught (in promise): error: no provider for angularfiredatabase! injectionerror". The error started coming when I started coding Home.ts file. Kindly refer the below code. Attached is the screenshot of the error message
Appmodule.ts code:
import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { HttpModule } from '@angular/http';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { AngularFireModule } from 'angularfire2';
import { FirebaseServiceProvider } from '../providers/firebase-service/firebase-service';
const firebaseConfig = {
apiKey: "AIzaSyD8os5zPpPWCOMH_NO9dizx-G--N60CeeE",
authDomain: "chatbuddy-47fe9.firebaseapp.com",
databaseURL: "https://chatbuddy-47fe9.firebaseio.com",
projectId: "chatbuddy-47fe9",
storageBucket: "chatbuddy-47fe9.appspot.com",
messagingSenderId: "146556908757"
};
@NgModule({
declarations: [
MyApp,
HomePage
],
imports: [
BrowserModule,
HttpModule,
AngularFireModule.initializeApp(firebaseConfig),
IonicModule.forRoot(MyApp)
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
HomePage
],
providers: [
StatusBar,
SplashScreen,
{provide: ErrorHandler, useClass: IonicErrorHandler},
FirebaseServiceProvider,
FirebaseServiceProvider
]
})
export class AppModule {}
Home.ts code:
import { FirebaseServiceProvider } from './../../providers/firebase-service/firebase-service';
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { FirebaseListObservable } from 'angularfire2/database';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
shoppingItems: FirebaseListObservable;
newItem = '';
constructor(public navCtrl: NavController, public FirebaseServiceProvider: FirebaseServiceProvider) {
this.shoppingItems = this.FirebaseServiceProvider.getShoppingItems();
}
addItems() {
this.FirebaseServiceProvider.addItem(this.newItem);
}
removeItem(id) {
this.FirebaseServiceProvider.removeItem(id);
}
}