Observable on angular firestore document not working

Question

I'm trying to assign an observable of a firestore document to an attribute of a service. I want to use it later with async pipe in template

I tried in all ways but can't get it work. Some help would be really great.

export class UserService {
    private currentUserObservable: Observable<User>;

    loadUserObservable(uid){ 
    this.currentUserObservable =this.afs.doc(`users/${uid}`).valueChanges()
    }
}

<div *ngIf="userService.currentUserObservable | async as user">
Displayname: {{ user.displayName }}
</div>

Answer 1

Well here you have an example of login library with sync user in database you can study it if you want to.

Auth module:
https://bitbucket.org/mises543/fire-ngx-auth/src/master/projects/auth/src/lib/

example app using this module:
https://bitbucket.org/mises543/fire-ngx-auth/src/master/projects/auth-test/

npm:
https://www.npmjs.com/package/@fire-ngx/auth