AngularAuth / Firebase - Firefox中登录屏幕上的电子邮件无效

时间:2018-03-02 12:07:07

标签: angular firebase firebase-authentication angularfire

我使用angular和firebase登录我的firebase网络应用程序。使用Firefox时,我简要地得到错误:

  

auth / invalid-email /电子邮件地址格式错误。

但是,用户名和密码是正确的,我已正确路由到已登录的应用程序。

HTML

 <form *ngIf="authService.showLogin" #loginForm="ngForm" action="" (submit)="login()" autocomplete="off" method="POST">
    <h1> Sign In </h1>
    <div class="form-group">
      <div>
        <label> Email Address </label>
        <input type="email" placeholder="name@company.com" [(ngModel)]="email" name="email"
          required/>
      </div>
    </div>
    <div class="form-group">
      <div>
        <label> Password </label>
        <input type="password" placeholder="Password" [(ngModel)]="password" name="password"
          required/>
      </div>
    </div>
    <div *ngIf="authService.incorrectPassword">
      <span class="error__msg">{{ authService.incorrectPassword }}</span>
    </div>

    <button type="submit" [disabled]="loginForm.invalid" (click)="login()"> Sign In </button>

  </form>



...
constructor(private afAuth: AngularFireAuth) {}
...

login(email: string, password: string): Observable<boolean> {

  this.firebaseAuth.auth.signInWithEmailAndPassword(email, password).then(value => {

    if (this.stateURL != undefined) {
      this.router.navigate([this.stateURL]);
      return Observable.of(true);
    } else {
      this.router.navigate(['folders']);
      return Observable.of(true);
    }
  })
  .catch(err => {
    // console.log(err['code']);
    var errorCode = err.code;
    var errorMessage = err.message;
    console.log(errorCode + ' / ' + errorMessage);
    this.incorrectPassword = ErroAuthEn.convertMessage(err['code']);
    return Observable.of(false);
  });

return;
}

当我将错误记录到UI以通知用户时,这个有点烦人,因为我在正确登录之前简要地看到了错误。

有没有办法解决这个问题?

1 个答案:

答案 0 :(得分:2)

我会在这个黑暗中采取疯狂的刺,并说这很可能是你的问题:

<form *ngIf="authService.showLogin" #loginForm="ngForm" action="" (submit)="login()" autocomplete="off" method="POST"> 

你正在使用两种Angulars的方式来写一个表格而不是。

应该是什么样的:

<form *ngIf="authService.showLogin" #loginForm="ngForm" (ngSubmit)="login()" autocomplete="off" novalidate">

此处我已移除actionmethod以及submit替换ngSubmit。看看这是否有助于解决问题。

此外,我发现您正在运行login两次,请将其删除:

(click)="login()"来自提交按钮。