Question

我的代码中有一个愚蠢的错误，我需要登录两次才能登录。即使它是第一次使用，因为第一次登录后它会在控制台中打印出可观察到的用户详细信息private user: Observable<firebase.User>; private userDetails: firebase.User = null;

我在登录方法中的其他逻辑不起作用，例如：

if (this.userDetails) {
email = this.userDetails.email;
console.log("hello im user" + " " + email);

这第一次给我带来了不确定性，因为它看起来像在可观察到的返回userDetails之前调用了此代码。如何避免这种情况？如何解决这个问题？这是我的 Auth服务代码

export class AuthService {
  private user: Observable<firebase.User>;
  private userDetails: firebase.User = null;
  public loggedIn = false;



  constructor(private _firebaseAuth: AngularFireAuth, private router: Router) {
    this.user = _firebaseAuth.authState;
    this.loggedIn = !!sessionStorage.getItem('user');

    this.user.subscribe(
        (user) => {
          if (user) {
            this.userDetails = user;

            console.log(this.userDetails);
          } else {
            this.userDetails = null;
          }
        }
      );
  }

  // Set current user in your session after a successful login
    setCurrentUser(email: string): void {
        sessionStorage.setItem('user', email);
        this.loggedIn = true;
    }

    // Get currently logged in user from session
    getCurrentUser(): string | any {
        return sessionStorage.getItem('user') || undefined;
    }

    isLoggedIn() {
    return this.loggedIn;
    }

  logUserIn(email, pass) {
    firebase.auth().signInWithEmailAndPassword(email, pass).catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
console.log("error" + error);
})
//var user = firebase.auth().currentUser;

if (this.userDetails) {
email = this.userDetails.email;
console.log("hello im user" + " " + email);

this.setCurrentUser(email);
 this.loggedIn = true;
} else {
console.log("not working");
}

this.router.navigate(['']);
}

在使用可观察到的userDetails之前，我只是在使用var user = firebase.auth().currentUser;，并且运行良好。

所以我正在寻找帮助以确保此代码块

if (this.userDetails) {
    email = this.userDetails.email;
    console.log("hello im user" + " " + email);

    this.setCurrentUser(email);
     this.loggedIn = true;

内部logUserin()仅在返回userDetails观察值后才被调用。

感谢您的帮助。

Answer 1

您需要在订阅中放入if语句，以便仅在用户返回后才调用。

this.user.subscribe(
        (user) => {
          if (user) {
            this.userDetails = user;

    email = this.userDetails.email;
    console.log("hello im user" + " " + email);

    this.setCurrentUser(email);
     this.loggedIn = true;

            console.log(this.userDetails);
          } else {
            this.userDetails = null;
          }
        }
      );

如何在Angular中使用Firebase登录身份验证解决可观察到的问题

1 个答案: