Ionic 2 Angular 2 - impossible d'accéder à NavController à partir de la méthode

Question

J'essaie de naviguer vers une autre page après que l'utilisateur ait été authentifié avec angularfire. Tout fonctionne sauf naviguer vers une autre page.

Voici mon code:

constructor(public navCtrl: NavController, public menu: MenuController, public afAuth: AngularFireAuth, public db: AngularFireDatabase, private platform : Platform) { 
    this.navigateIfUserIsLogdIn(); 
    } 

    navigateIfUserIsLogdIn(){ 
     this.authState = this.afAuth.authState; 
     this.user = this.afAuth.auth.currentUser; 

     this.afAuth.auth.onAuthStateChanged(function(user) { 
      if (user) { 
      // User is signed in. 
      this.navCtrl.setRoot(HomePage); 
      } else { 
      // No user is signed in. 
      } 
     }); 
    } 

L'erreur que je reçois est:

Erreur: Uncaught (en promesse): TypeError: Impossible de lire la propriété 'navCtrl' undefined

Pourquoi ne fonctionnera-t-il pas à l'intérieur de navigateIfUserIsLogdIn()?

s'il vous plaît aider et vous donner un exemple :)

Answer 1

Vous devez utiliser les fonctions de direction comme celui-ci:

navigateIfUserIsLogdIn(){ 
    this.authState = this.afAuth.authState; 
    this.user = this.afAuth.auth.currentUser; 

    this.afAuth.auth.onAuthStateChanged((user) => { 
     if (user) { 
     // User is signed in. 
     this.navCtrl.setRoot(HomePage); 
     } else { 
     // No user is signed in. 
     } 
    }); 
} 

Notez que maintenant nous

this.afAuth.auth.onAuthStateChanged((user) => {...});

au lieu de

this.afAuth.auth.onAuthStateChanged(function(user) {

En utilisant les fonctions de direction, la propriété this n'est pas écrasé et références encore l'instance du composant (sinon, les this des points clés à la fonction interne et navCtrl ne sont pas définis dans il).

Answer 2

essayer de le faire

 constructor(public navCtrl: NavController, public menu: MenuController, public afAuth: AngularFireAuth, public db: AngularFireDatabase, private platform : Platform) { 
    this.navigateIfUserIsLogdIn(); 
    } 

    navigateIfUserIsLogdIn(){ 
     this.authState = this.afAuth.authState; 
     this.user = this.afAuth.auth.currentUser; 
     var that= this; 
     this.afAuth.auth.onAuthStateChanged(function(user) { 
      if (user) { 
      // User is signed in. 
      that.navCtrl.setRoot(HomePage); 
      } else { 
      // No user is signed in. 
      } 
     }); 
    }