Bdtjtk

Trying to make that each user can create and read his own data.
I am working everything same as in this tutorial but its not working as there:
https://angularfirebase.com/lessons/managing-firebase-user-relationships-to-database-records/

My database is structured like this:

 -|items

     -|userId

         -|itemId

This is my service:

  userId: string;



  constructor(private db: AngularFireDatabase, private afAuth: AngularFireAuth) {

    this.afAuth.authState.subscribe(user => {

      if(user) this.userId = user.uid

    })

  }

And example function in service that gets items from database:

getRelays(): Observable<any> {

    if(!this.userId) return;

    this.relaysRef = this.db.list('relays/' + this.userId)

    return this.relaysRef.snapshotChanges().pipe(

      map(changes => 

        changes.map(c => ({ $key: c.payload.key, ...c.payload.val() }))

      )

    );

  }

I want to access that current users id in component so I can get items based on current user but variable userId only works inside subscription and returns undefined outside it.

This is how i login and logout (in another component):

login() {

  this.afAuth.auth.signInWithPopup(new auth.GoogleAuthProvider());

}



logout() {

  this.afAuth.auth.signOut();

}

Thanks for help!

It's because observables are asynchronus. Since the details of the user are brought in an asynchronous manner. The userId will not be available outside the subscribe method. So you need to write the logic inside the subscribe block inorder to achieve the desired result.

this.afAuth.authState.subscribe(user => {

      if(user) this.userId = user.uid

      //you have to write the logic here.



    }) 

the problem you faced because you are subscribing to an observable and whenever it notice any changes it get some data with id and changes the value of "uid".
the best approach to handle this is to store "responce.uid" to your local storage and get that id whenever you need from local storage.
like this

 this.api.getUser(res.user.uid).subscribe(resp => {

    if (resp) {

      localStorage.setItem('uid', res.user.uid);

      localStorage.setItem('email', this.user.email); })

you can create a service which will store current user data.

interface IUser {

  id: number;

  name: string;

}



@Injectable()

export class CurrentUserService {

  user: IUser;

}

somewhere in your firebase auth code:

whenLoggedIn(user: IUser) {

  this.currentUserService.user = user;

}

Component

constructor(public currentUserService: CurrentUserService) {}

Template

{{ currentUserService.user.id }}