Quantcast
Channel: Ionic Forum - Latest topics
Viewing all articles
Browse latest Browse all 71530

Help new Ionic Developer here

$
0
0

@genesiow wrote:

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;
//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 {}

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 71530

Trending Articles