Q:

Can't get data from JSON object from firebase

I want to get 'userRole' of logged in user from my JSON object requested from my firebase database. So I tried the following code:
ionViewWillLoad(){
    this.afAuth.authState.subscribe(user => {
        this.ref = user.uid;
        this.userService.getUserById(this.ref).subscribe(data => {
            this.data = data
            console.log(this.data);
        })
    });
}

File I get from my database looks something like this:
0:{$value: "admin@gmail.com", $key: "email", $exists: ƒ}
1:{$value: "password", $key: "password", $exists: ƒ}
2:{$value: 1, $key: "userRole", $exists: ƒ}
3:{$value: "", $key: "worksFor", $exists: ƒ}

How can I access "userRole" from this JSON object? I tried 'data.userRole', 'data[2].$value', but these don't work.
Following is the code to add a new user to database:
getUserById(id){
    return this.afd.list('/users/' + id);
}

register(user){
    return this.afAuth.auth.createUserWithEmailAndPassword(user.email, user.password).then(data => {
        this.afd.object('/users/' + data.uid).update(user);
    });
}

Is there something wrong with the way I add data to the database?
Thank You!

A:

Firebase has several products, I think you will need to use two of them. Authentication to control user authentication and Realtime database to save other informations as Address, phone, and other data related to your project. 
In my case, I prefer to wrap users information in a service - my example. Fragment:
import { AngularFireDatabase } from 'angularfire2/database';
import { AngularFireAuth } from 'angularfire2/auth';

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

load() {
    let promise = new Promise((resolve, reject) => {
        this.afAuth.authState.subscribe((auth) => {
            this.authState = auth
            resolve(true);
        },
            err => reject(err)
        );
    });

    return promise;
}

get userID(): string {
    return this.authenticated ? this.authState.uid : '';
}

retrieveUser(): any {
    if(this.authenticated === undefined){
        console.log('You need to authenticate first.');
        return null;
    }

    this.user = this.db.object('/users/'+ this.userID)
                    .valueChanges()
                    .publishReplay(1)
                    .refCount();

    return this.user;
}

An I use like this:
this.authService.retrieveUser().subscribe(user => {
  this.user = user;  
});

