this.currentUser$=this.afs.doc('users/'+this.authState.uid).valueChanges().pipe();
When I am using in component.html like
{{ currentUser$|async|json}}
I am getting it like below:
{
"photoUrl": "",
"password": "",
"mobileVerified": true,
"id": "izoNRvk0moN579KqfQ1cVqNvpZJ2",
"phone": "5544663311",
"email": "[email protected]",
"name": "Rob B",
"userRole": "admin"
}
Now for example I want to access just email or userRole, how I can do it?
Set the value in pipe.
currentUser$: Observable<User>;
currentUser?: User;
:
this.currentUser$=this.afs.doc('users/'+this.authState.uid).valueChanges().pipe(
tap( value => {
this.currentUser = value;
})
);
Then you can access each property.
{{currentUser?.email}}
{{currentUser?.userRole}}
(property) HeaderComponent.currentUser?: User | undefined Argument of type 'MonoTypeOperatorFunction<User>' is not assignable to parameter of type 'OperatorFunction<unknown, User>'. Types of parameters 'source' and 'source' are incompatible. Type 'Observable<unknown>' is not assignable to type 'Observable<User>'. Type 'unknown' is not assignable to type 'User'.ts(2345)I used the suggestions here to get the values from single document from firebase collection, but had to make a little modification for currentUser<User> to currentUser<User | undefined> and it works perfectly.
private userDoc: AngularFirestoreDocument<User>;
currentUser: Observable<User | undefined>;
and in constructor:
this.userDoc = afs.doc<User>('users/'+this.docId);
this.currentUser = this.userDoc.valueChanges();
and in component.html I can access this like
{{(currentUser|async)?.email}}
{{(currentUser|async)?.userRole}}