javascript - Transmiterea datelor cu metoda asincronă de la un serviciu la un component Angular


Lucrez la o metodă de autentificare în serviciul meu care transmite date către componente atunci când utilizatorul se autentifică în aplicație. Această metodă de autentificare face o cerere HTTP și, în caz de succes, apelează metoda setAuthentication pentru a actualiza proprietățile pe care vreau să le împărtășesc.

Dar când vreau să folosesc aceste proprietăți într-un component, de exemplu o pagină de tablou de bord cu numele utilizatorului, folosind

  public currentUser = this.authService.currentUser

Nu primesc valorile actualizate ale proprietăților, doar null.

Acesta este codul meu de serviciu:

  public currentUserAuth:User | null =  null
  public currentUser:User | null =  null
  public currentState:authStatus = authStatus.Cheking
  

  public loginUser(loginInterface: loginInterface){
    const url = `${this.basicURL}/login`
    const body = {email: loginInterface.email, password1: loginInterface.password1}
    return this.http.post<loginResponse>(url, body)
    .pipe
    (map(({user, token, currentUser}) => this.setAuthentication(user, token, currentUser!)),
    catchError(err => throwError(() => err.error.message))
    )
  }

  public setAuthentication(userPayload:User, token:string, currentUser: User){
    this.currentUserAuth = userPayload
    this.currentState = authStatus.Authenticated
    this.currentUser = currentUser
    localStorage.setItem('token', token)
    
    return true
  }

Apreciez orice ajutor

Răspuns #1

Vă rugăm să schimbați currentUser într-o metodă getter în schimb

public get currentUser(): any {
    return this.authService.currentUser;
}

Dacă nu îți place să folosești metode getter, atunci trebuie să setezi proprietatea currentUser doar după ce valoarea este setată în serviciu, mai jos presupun că currentUser în serviciu este setat înainte ca ngoninit să ruleze!

public currentUser;

ngOnInit(): void {
    this.currentUser = this.authService.currentUser;
}