I have a small application for light control, it works very well, but when I start it for fourth or more times, the application no longer connects with Firebase (it does not show me the controls), but the application is still working.
I leave the HTML file and the ts file. To solve this error (on my cell phone) login to the application manager and delete the data and cache.
import { Component } from '@angular/core';
import { NavController, AlertController } from 'ionic-angular';
import { FirebaseListObservable, AngularFireDatabase } from 'angularfire2';
@Component({
selector: 'page-about',
templateUrl: 'about.html'
})
export class AboutPage {
tasks: FirebaseListObservable<any>;
constructor(
public navCtrl: NavController,
public alertCtrl: AlertController,
public database: AngularFireDatabase
) {
this.tasks = this.database.list('/Publiart')
}
createTask(){
let newTaskModal = this.alertCtrl.create({
title: 'Nueva Luz',
message: "Ingrese Nueva Luz",
inputs: [
{
name: 'title',
placeholder: 'Title'
},
],
buttons: [
{
text: 'Cancelar',
handler: data => {
console.log('Cancel clicked');
}
},
{
text: 'Guardar',
handler: data => {
this.tasks.push({
title: data.title,
done: false
});
}
}
]
});
newTaskModal.present( newTaskModal );
}
updateTask( task ){
setTimeout(()=>{
this.tasks.update( task.$key,{
title: task.title,
done: task.done
});
},1);
}
removeTask( task ){
this.tasks.remove( task );
}
}
<ion-header>
<ion-navbar color="primary">
<ion-title>
Control de Luces Publiart
</ion-title>
<ion-buttons start>
<button ion-button (click)="createTask()">
<ion-icon name="add"></ion-icon>
</button>
</ion-buttons>
</ion-navbar>
</ion-header>
<ion-content>
<ion-list>
<ion-item-sliding *ngFor='let task of tasks | async'>
<ion-item>
<ion-label>{{ task.title}}</ion-label>
<ion-toggle (ionChange)="updateTask( task )" [(ngModel)]="task.done"></ion-toggle>
</ion-item>
<!-- <ion-item-options>
<button ion-button danger (click)="removeTask( task )">
Delete
</button>
</ion-item-options> -->
</ion-item-sliding>
</ion-list>
</ion-content>