Angularfire2电子邮件身份验证引用承诺之外的变量

Question

我有这个组件：

export class LoginComponent {
  login_error = "";

  constructor(public af: AngularFire) {
    this.af.auth.subscribe(auth => console.log(auth));
  }

  login(credentials) {
      this.af.auth.login({ email: credentials.email, password: credentials.password})
      .catch(function (error) {
        switch (error.code) {
          case "INVALID_USER":
            console.log("Invalid email");
            this.login_error = "Email is invalid"; //<----- broken
            break;

          case "INVALID_PASSWORD":
            console.log("Invalid password");
            this.login_error = "Password is invalid"; //<----- broken
            break;

          default:
            break;   
        }
      });
  }

  logout(){
    this.af.auth.logout();
  }
}

我希望能够设置模板中使用的 login_error 变量（在 .catch 中），以通知用户他们的电子邮件或密码不正确，但我无法引用 Promise 之外的变量。我做错了什么还是有更好的方法来做我想要实现的目标？

Answer 1

我会改用箭头函数。因此，您将能够使用上下文 this（此处的组件实例）：

login(credentials) {
  this.af.auth.login({ email: credentials.email, password: credentials.password})
  .catch((error) => { // <-------
    switch (error.code) {
      case "INVALID_USER":
        console.log("Invalid email");
        this.login_error = "Email is invalid";
        break;

      case "INVALID_PASSWORD":
        console.log("Invalid password");
        this.login_error = "Password is invalid";
        break;

      default:
        break;   
    }
  });
}