Ionic 2 - Complete loading the data from firebase before loading the page

Hi All,

I’m a newbie using ionic framework.
I’m using angularfire2 to retrieve data from firebase. My question is, what is the way to complete the retrieval of the data before loading the page as my page is using data from firebase database? Below is part of my code. Thanks in advance.

  1. My provider class

    export class UserDataService {

    constructor(public af: AngularFire, public afAuth: AngularFireAuth) {

getCurrUserName(curUserUID): string {
console.log("in here: getCurrUserName(curUserUID): " + curUserUID);’/Users/’+curUserUID)
curUser.forEach(curUser => {
console.log("JSON.stringify(curUser): " + JSON.stringify(curUser));
if (curUser.key == ‘firstName’)
this.curUserName = curUser.val();
return this.curUserName;

  1. My ts file

    export class ProfilePage {
    constructor(public navCtrl: NavController, public navParams: NavParams, public uds: UserDataService) {

    this.curUserName = uds.getCurrUserName(this.authData.getCurrUserUid());

  2. My html file wanted to display curUserName in the ion-title but it is not being displayed.