Cannot read property 'navCtrl' of undefined

Question

For hours I\'ve been searching for a solution to this problem in my project to no avail. I\'ve read many of the other \"Cannot read property ... of undefined\" posts, but ca

Answer 1

A better way to solve this issue would be by using arrow functions:

An arrow function expression has a shorter syntax than a function expression and does not bind its own this, arguments, super, or new.target.

So your issue would be solved by just changing the onSignIn method like this:

  onSignIn() {
    firebase.auth().signInWithPopup(provider).then((result) => {
      console.log(result.credential.accessToken);
      console.log(result.user.displayName);
      this.navCtrl.setRoot(HomePage);
    }).catch(function(error) {
      console.log(error.message);
    });
  }

Notice the (result) => {...} instead of the function(result) {...}