javascript - Bir servisten bir bileşene veriyi asenkron yöntemle aktarmak Angular


Kullanıcı uygulamaya giriş yaptığında verileri bileşenlere geçiren bir Login yönteminde çalışıyorum. Bu giriş yöntemi bir http isteği yapıyor ve başarılı olursa, paylaşmak istediğim özellikleri güncellemek için setAuthentication yöntemini çağırıyor.

Ama bu özellikleri bir bileşende, örneğin kullanıcının adıyla bir gösterge paneli sayfasında kullanmak istediğimde, kullanarak

  public currentUser = this.authService.currentUser

Güncellenmiş özellik değerlerini almıyorum, sadece null.

Bu benim servis kodum:

  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
  }

Her türlü yardımı takdir ederim

Cevap #1

Lütfen currentUser öğesini bir getter metodu olarak değiştirin

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

Getter yöntemlerini kullanmayı sevmiyorsanız, o zaman currentUser özelliğini yalnızca değeri serviste ayarlandıktan sonra ayarlamanız gerekir, aşağıda serviste currentUser'in ngoninit çalışmadan önce ayarlandığını varsayıyorum!

public currentUser;

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