Basic Alert Throws Exception

Hi, I’m trying to add a basic alert to my code below but I’m getting an exception:

EXCEPTION: TypeError: this.nav.present is not a function

The console.log(“Login Failed!”, error) correctly shows the error coming back from Firebase, but the ionic alert doesn’t work (by the way, Firebase authentication works as expected)

Any ideas?

import {IonicApp, Page, NavController, Alert} from 'ionic/ionic';
import {TabsPage} from '../tabs/tabs';
import {SignupPage} from '../signup/signup';
import {UserData} from '../../providers/user-data';

  templateUrl: 'build/pages/login/login.html'
export class LoginPage {
  constructor(nav: NavController, userData: UserData) {
    this.nav = nav;
    this.userData = userData;
    this.login = {};
    this.submitted = false;

  onLogin(form) {
    this.submitted = true;
    if (form.valid) {
      /* Authenticate User with Firebase */
      var ref = this.userData.firebaseRef();
        email    : form.controls.username.value,
        password : form.controls.password.value
      }, this.authHandler);
  authHandler(error, authData) {
    if (error) {
        console.log("Login Failed!", error);
        let alert = Alert.create({
          title: 'Login Failed!',
          subTitle: error,
          buttons: ['Ok']
    } else {
  onSignup() {
    console.log("testing signup");

For anybody else struggling with this issue, here’s how I got it to work

1 Like