如何在 ionic 3 上的密码或电子邮件错误时提醒用户？答案

【问题标题】：How to alert the user when their password or email is wrong on ionic 3?如何在 ionic 3 上的密码或电子邮件错误时提醒用户？
【发布时间】：2019-01-26 03:48:38
【问题描述】：

我正在尝试使用 showAlert 创建检查，以便在用户输入错误的电子邮件或密码时通知用户，但我无法使用 try and catch

我可以通过 try and catch 来做到这一点吗？

这是我的 login.ts 代码示例

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { User } from '../../models/user';
import { AngularFireAuth } from "angularfire2/auth";
import { MenuController } from "ionic-angular";
import { AlertController } from "ionic-angular";

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {

  user = {} as User;

  constructor(private afAuth: AngularFireAuth, public navCtrl: NavController, public navParams: NavParams, public menu: MenuController, public alertCtrl: AlertController) {
  }

ionViewWillEnter(){
  this.menu.enable(false);
}

 async login(user: User){
  try{
    const result = await this.afAuth.auth.signInWithEmailAndPassword(user.email, user.password);
    if (result) {
      this.navCtrl.setRoot('HomePage');
    }
  }
  catch {
    showAlert() {
      const alert = this.alertCtrl.create({
        title: 'New Friend!',
        subTitle: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
        buttons: ['OK']
      });
      alert.present();
    }
  }

 }

 register(){
   this.navCtrl.push('RegisterPage');
 }

}

【问题讨论】：

您目前有什么问题？
对不起，如果我的问题不是很清楚，但我希望用户在输入错误的用户名或密码时得到提醒
我的意思是，您发布的代码有什么问题？
我的函数在 catch 中不起作用
你不应该试图在另一个方法中定义一个方法。如果您只想在 catch 块中显示警报，请删除 showAlert() { 和匹配的 }，留下里面的代码。如果您还想从其他地方调用此方法，请将其移出login 并将其称为this.showAlert();。

标签： javascript typescript ionic3

【解决方案1】：

我决定如下

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { User } from '../../models/user';
import { AngularFireAuth } from "angularfire2/auth";
import { MenuController } from "ionic-angular";
import { AlertController } from "ionic-angular";

@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {

  user = {} as User;

  constructor(private afAuth: AngularFireAuth, public navCtrl: NavController, public navParams: NavParams, public menu: MenuController, public alertCtrl: AlertController) {

  }

  showAlert() {
    const alert = this.alertCtrl.create({
      title: 'Atenção',
      subTitle: 'Seu e-mail ou senha estão incorretos, por favor tente novamente.',
      buttons: ['OK']
    });
    alert.present();
  }

  ionViewWillEnter(){
    this.menu.enable(false);
  }

 async login(user: User){
  try{
    const result = await this.afAuth.auth.signInWithEmailAndPassword(user.email, user.password);
    if (result) {
      this.navCtrl.setRoot('HomePage');
    }
  }
  catch {
    this.showAlert();
  }

 }

 register(){
   this.navCtrl.push('RegisterPage');
 }

}

【讨论】：