Angular如何從firebase doc訪問Json Array中的值

Question

this.currentUser$=this.afs.doc('users/'+this.authState.uid).valueChanges().pipe();

當我在 component.html 中使用時

{{ currentUser$|async|json}}

我得到它如下：

{
  "photoUrl": "",
  "password": "",
  "mobileVerified": true,
  "id": "izoNRvk0moN579KqfQ1cVqNvpZJ2",
  "phone": "5544663311",
  "email": "admin@example.com",
  "name": "Rob B",
  "userRole": "admin"
}

例如，現在我只想訪問email或userRole ，我該怎么做？

Answer 1

設置pipe中的值。

currentUser$: Observable<User>;
currentUser?: User;

 :

 this.currentUser$=this.afs.doc('users/'+this.authState.uid).valueChanges().pipe(
  tap( value => {
    this.currentUser = value;
  })
 );

然后您可以訪問每個屬性。

{{currentUser?.email}}
{{currentUser?.userRole}}

Answer 2

我使用此處的建議從 firebase 集合中的單個文檔中獲取值，但必須對currentUser<User>到currentUser<User | undefined>進行一些修改 currentUser<User | undefined>並且它工作得很好。

private userDoc: AngularFirestoreDocument<User>;
currentUser: Observable<User | undefined>;

在構造函數中：

this.userDoc = afs.doc<User>('users/'+this.docId);
this.currentUser = this.userDoc.valueChanges();

在component.html中我可以像這樣訪問它

{{(currentUser|async)?.email}}
{{(currentUser|async)?.userRole}}