I’m getting an issue in which nothing is displaying on my ionic app.I’m thinking it has something to do with app.module.ts file.Does anybody know how to fix this.By the way, Im using ionic serve – lab to run.This is an to do app using some angular fire modules.Only after did I modify my package.json and app.module.ts did things do wrong.
tasklist.ts
import { Component } from ‘@angular/core’;
import { NavController,ItemSliding } from ‘ionic-angular’;
import {AngularFireDatabase, FirebaseListObservable } from ‘angularfire2/database’;
//grab object from task
@Component({
selector: ‘page-tasklist’,
templateUrl: ‘tasklist.html’
})
export class TaskListPage {
//Formerly an Array: tasks:Array= [];
tasks:FirebaseListObservable<any[]>;
//this is like a contructor of any class
constructor(public navCtrl: NavController, public af:AngularFireDatabase) {
//refers to the constuctor
//updated angular
this.tasks= af.list('/tasks');
}
//this is a function in typescript
addItem(){
//variable declaration
let theNewtask: string = prompt(“New task”);
if(theNewtask !== ’ '){
this.tasks.push({title:theNewtask,status:‘open’});
}
}
markAsDone(slidingItem:ItemSliding,task:any){
this.tasks.update(task.$key,{status:‘done’});
slidingItem.close();
}
removetask(slidingItem:ItemSliding,task:any){
this.tasks.remove(task.$key);
slidingItem.close();
}
}
app.module.ts
import { NgModule, ErrorHandler } from ‘@angular/core’;
import { BrowserModule } from ‘@angular/platform-browser’;
import { HttpModule } from ‘@angular/http’;
import { IonicApp, IonicModule, IonicErrorHandler } from ‘ionic-angular’;
import { MyApp } from ‘./app.component’;
import { StatusBar } from ‘@ionic-native/status-bar’;
import { SplashScreen } from ‘@ionic-native/splash-screen’;
import { TaskListPage } from ‘…/pages/tasklist/tasklist’;
import { AngularFireModule} from ‘angularfire2/’;
import { AngularFireDatabaseModule } from ‘angularfire2/database’;
export const firebaseConfig={
apiKey: “AIzaSyCCIoGHcQiGUzETHTcEb-BgUtSTvCGpocU”,
authDomain: “ionic2do-1c78e.firebaseapp.com”,
databaseURL: “https://ionic2do-1c78e.firebaseio.com”,
projectId: “ionic2do-1c78e”,
storageBucket: “ionic2do-1c78e.appspot.com”,
messagingSenderId: “31902787903”
};
@NgModule({
declarations: [
MyApp,
TaskListPage
],
imports: [
BrowserModule,
HttpModule,
IonicModule.forRoot(MyApp),
AngularFireModule.initializeApp(firebaseConfig),
AngularFireDatabaseModule
],
bootstrap: [IonicApp],
entryComponents: [
MyApp,
TaskListPage
],
providers: [
StatusBar,
SplashScreen,
{ provide: ErrorHandler, useClass: IonicErrorHandler }]
})
export class AppModule {}