Hi!
I am trying to create a project in which a user has a list of exercises . The database is Firebase . The problem I have is that by showing the list of exercises , it does well , but when I adapt a value from Firebase or from a modal , the list does not cool exercise value. If I look in the browser if I see how I get the event and the new value , but the interface is not reflected .
Exercises.ts
import { Component } from '@angular/core';
import { AuthData } from '../../providers/auth-data/auth-data';
import { NavController, AlertController, ModalController } from 'ionic-angular';
import { PrPage } from '../pr/pr';
import * as firebase from 'firebase';
/**
Class for the ExercisesPage page.
*/
@Component({
templateUrl: 'build/pages/exercises/exercises.html',
providers: [AuthData]
})
export class ExercisesPage {
public exercises: any;
public userProfile : any;
public currentUserId : any;
/**
Constructor
*/
constructor( private navCtrl: NavController,
public authData: AuthData,
public modalCtrl: ModalController,
public alertCtrl: AlertController ) {
this.currentUserId = this.authData.getCurrentUserId();
this.userProfile = firebase.database().ref('/users');
var exercises = [];
this.userProfile.child(this.currentUserId + '/exercises').on('value' , function(snapshot) {
if (exercises.length != 0){
exercises = [];
}
// we need to add a new id property using key
// for later we can to access at element
snapshot.forEach(function(exercise) {
let value = exercise.val();
value.id = exercise.key;
// add new container
exercises.push( value );
});
});
this.exercises = exercises;
var changeExerciseChild = this.userProfile.child(this.currentUserId + '/exercises');
changeExerciseChild.on('child_changed', function(data) {
console.log (data.key);
console.log (data.val());
});
}
/**
[exerciseTapped Description]
When user click over event we need to launch modal view
to complete action, change pr value or cancel.
@param event [which fire]
@param exercise [exercise pressed]
*/
exerciseTapped(event, exercise) {
let modal = this.modalCtrl.create(PrPage, { "exercise": exercise });
modal.present();
}
}
Can you help me?