Data is not reading from firebase database

Here is my app.module.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 { MyBudgetPage } from '../pages/my-budget/my-budget';
import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabase, AngularFireDatabaseModule, FirebaseListObservable } from 'angularfire2/database';

export const firebaseConfig = {
};

@NgModule({
  declarations: [
    MyApp,
    HomePage,
    MyBudgetPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    AngularFireModule.initializeApp(firebaseConfig),
    AngularFireDatabaseModule
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    MyBudgetPage
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    AngularFireDatabase,
    AngularFireDatabaseModule
  ]
})
export class AppModule {}

And Here is my home.html code
<ion-row *ngFor="let month of monthWiseBudget | async">
          <ion-col col-6>{{month.Item}}</ion-col>
          <ion-col col-3>{{month.Actual}}</ion-col>
          <ion-col col-3>{{month.Spent}}</ion-col>
        </ion-row>

And here is home.ts code
import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams, Slides } from 'ionic-angular';
import { AngularFireDatabase, FirebaseListObservable } from 'angularfire2/database';

@IonicPage()
@Component({
  selector: 'page-my-budget',
  templateUrl: 'my-budget.html',
})
export class MyBudgetPage {

@ViewChild(Slides) slides: Slides;

  monthWiseBudget:FirebaseListObservable<any[]>;

  constructor(public navCtrl: NavController, public navParams: NavParams, angFire: AngularFireDatabase) {
    this.monthWiseBudget = angFire.list('/Months');
  
  }

What did you already try? Do you receive any errors? Does /Months exists in your fb database? Do you connect to it properly? questions questions questions…

I just started using Firebase and it works OK but I do not put in the providers section - just the imports:

try putting either public or private before

angFire: AngularFireDatabase

in your constructor

image… No error But data is not reading

ionViewDidLoad()

{

this.monthWiseBudget = angFire.list(’/Months’);
}
Did you add this in your home,ts file,because I cannot find it…

I have tried this, But not working

Eventhough i removed those and checked but no use.

Thanks for your response vithika. I figured out issue and fixed

1 Like

Thanks for every one