AngularFire2 4.0ディスプレイのユーザーの電子メール

Question

イム2バージョン4.0のアップグレードのドキュメントAngularFireに、次の私のヘッダー・コンポーネントで、ユーザーの電子メールを表示しようとしている：https://github.com/angular/angularfire2/blob/master/docs/version-4-upgrade.md

Header.component

import { Component, OnInit } from '@angular/core'; 
import { AuthService } from './auth.service'; 
import * as firebase from 'firebase/app'; 
import { Observable } from 'rxjs/Observable'; 
import { Router } from '@angular/router'; 
import { AngularFireAuth } from 'angularfire2/auth'; 
import { AngularFireDatabase, FirebaseListObservable,FirebaseObjectObservable } from 'angularfire2/database'; 

@Component({ 
    selector: 'app-header', 
    templateUrl: './header.component.html', 
    styleUrls: ['./header.component.css'] 
}) 
export class HeaderComponent implements OnInit { 
    user: Observable<firebase.User>; 
    constructor(afAuth: AngularFireAuth) { 
    this.user = afAuth.authState; 
    } 

header.html

<div> {{ (user | async)? | json }} </div> 

私はこれを好きなら、私はHTMLのObjectオブジェクトを取得します。括弧の外側にある疑問符を削除すると、htmlは電子メールを含む多くの情報を含むjsonを表示します。 私が欲しいのは、このようにHTMLで電子メール、何かを表示することです：

<div> {{ user?.email }} </div> 

私の2番目の質問は、私はまたfirebase、データベース内のユーザーの電子メールを持っていることです。その情報を表示するためにfirebase authまたはfirebaseデータベースを使用する必要がありますか？ Firebaseデータベースを使用する必要がある場合は、どうしたらいいですか？

いつもありがとうございました！

Answer 1

私はこの問題にもつまずいた。起こっていることは、評価の時点でのあなたのユーザーは、ログインの結果ではなく、依然として観察可能であるということです。解決すると（|非同期）、電子メールが利用可能になります。あなたの部署では、次のように入力する必要があります。

{{(user | async)?.email}} 

これはそれです。

希望に役立ちます。