Login email and password from firebase

Ionic Framework
1

this is my code admin login.ts

import { Component } from ‘@angular/core’;
import { IonicPage, NavController, NavParams, AlertController, LoadingController, ToastController } from ‘ionic-angular’;
import { AdminDashboardPage } from ‘…/admin-dashboard/admin-dashboard’;
import { AngularFireAuth } from ‘angularfire2/auth’;

@IonicPage()
@Component({
selector: ‘page-admin-login’,
templateUrl: ‘admin-login.html’,
})
export class AdminLoginPage {

constructor(public navCtrl: NavController, public navParams: NavParams,
public alertCtrl: AlertController, private afAuth: AngularFireAuth,
public loadingCtrl:LoadingController, public toastCtrl: ToastController) {
}

ionViewDidLoad() {
console.log(‘ionViewDidLoad AdminLoginPage’);
}

SignInAdmin(){
var email = "admin@gmail.com";
var password = “admin123”;
var that = this;

var loader = this.loadingCtrl.create({
  content: "Please wait..."
});
loader.present();

this.afAuth.auth.signInWithEmailAndPassword(email,password) 
  //successful
  loader.dismiss();
  that.navCtrl.setRoot(AdminDashboardPage);

 error => {

loader.dismiss();
// Unable to log in
let toast = this.toastCtrl.create({
message: error,
duration: 3000,
position: ‘top’
});
toast.present();
};
}

but why i got this error can somebody help me

image
image.png315×535 23.3 KB

2

Can you show your html? On html your atributte for click is like'click()' ? Try to change for (click)="anyEvent()"

3

<ion-header>

<ion-navbar>

</ion-navbar>

</ion-header>

<ion-content padding>

<img src=“assets/imgs/Logo.jpg” alt=“Logo” class=“center”>

<ion-list>

<ion-item>

<ion-label floating>Email</ion-label>

<ion-input type=“text” [(ngModel)]=“email” name=“email”></ion-input>

</ion-item>

<ion-item>

<ion-label floating>Password</ion-label>

<ion-input type=“password” [(ngModel)]=“password” name=“password”></ion-input>

</ion-item>

</ion-list>

<div padding>

<button block ion-button (click)=“SignInAdmin()”>Admin</button>

</div>

</ion-content>

this is admin login.html

4

Try this way

<form> <!-- Form submit-->
  <ion-item>
    <ion-input name="authUsername" [(ngModel)]="authUsername" type="email"></ion-input>
  </ion-item>
  <ion-item>
    <ion-input name="authPassword" [(ngModel)]="authPassword" type="password"></ion-input>
  </ion-item>
  <button ion-button block round type="submit" class="padding-left-row" text-capitalize (click)="executeLogin()">
    Log-in
  </button> <!-- Type submit-->
</form>
5

same problem…

<ion-item>

<ion-input name=“authUsername” [(ngModel)]=“authUsername” type=“email”></ion-input>

</ion-item>

<ion-item>

<ion-input name=“authPassword” [(ngModel)]=“authPassword” type=“password”></ion-input>

</ion-item>

<button ion-button block round type=“submit” class=“padding-left-row” text-capitalize (click)=“executeLogin()”>

Log-in

</button>

image
image.png315×527 23.2 KB

6

Remove the button tag

Change to:
<ion-button block round type=“submit” class=“padding-left-row” text-capitalize (click)=“executeLogin()”>Log-in