ユーザーを認証してその詳細を保存する方法

Question

私はangularfire2文書を読んでみましたが、ここまで来ました。私の認証サービスコールは、anglefire.auth.loginです。この関数を購読し、返されたuserinfoをデータベースに保存します。すべての 'のdisplayName' の

Error: Typescript found the following errors: /Users/macbook/dev/app/kichenclub/tmp/broccoli_type_script_compiler-input_base_path-nMnfGgj9.tmp/0/src/app/auth.service.ts (12, 25): Property 'displayName' does not exist on type 'FirebaseAuthState'.

と同じ：

活字体、コンパイラはエラーを返します。

私は正しい方向にいるのでしょうか？これをどうやって解決するか。

authentication.service.ts：

import { Injectable } from '@angular/core'; 
import { AngularFire, AuthProviders, AuthMethods } from 'angularfire2'; 

@Injectable() 
export class AuthService { 
    private userModel= this.af.database.object('/users'); 
    constructor(private af: AngularFire) { 
    this.af.auth.subscribe((auth) => { 
     console.log(auth); 
     this.userModel.set({ 
     uid: auth.uid, 
     firstName: auth.displayName.split(0, auth.displayName.lastIndexOf(' ')), 
     lastName: auth.displayName.split(auth.displayName.lastIndexOf(' '), auth.displayName.length), 
     displayPic: auth.photoURL, 
     provider:auth.provider 
     }); 
    }); 
    } 

    public loginFacebook(): void { 
    this.af.auth.login({ 
     provider: AuthProviders.Facebook, 
     method: AuthMethods.Popup 
    }) 
    } 
} 

任意のより詳細な情報が必要な場合、私に教えてください。

最後に、お立ち寄りいただきありがとうございます。 :)

Answer 1

私はGitHubのangularfire2ソースコードを見て、FirebaseAuthStateインターフェイスを調べました。それはhereです。 TypeScriptインターフェイス自体に 'displayName'というプロパティがないことがわかります。しかし、それは私はあなたがauth.facebookプロパティを詳しく見てみたくなると思うデータを保持するように見えるがNULL可能なタイプは、あなたが

export interface FirebaseAuthState { 
    uid: string; 
    provider: AuthProviders; 
    auth: firebase.User; 
    expires?: number; 
    github?: CommonOAuthCredential; 
    google?: GoogleCredential; 
    twitter?: TwitterCredential; 
    facebook?: CommonOAuthCredential;//<---based on your code I think this is what you're looking for. 
    anonymous?: boolean; 
} 

を探していることを示しています。詳細をよりよく理解するために、subscribeメソッドのコードをコメントアウトして、コンソールにオブジェクトを書き込んで、ブラウザの開発ツールを使ってブラウザでそれを見てみましょう。たとえば、次のようなものです。

this.af.auth.subscribe((auth) => { 
    console.log(auth); 
    //this.userModel.set({ 
    //uid: auth.uid, 
    //firstName: auth.displayName.split(0, auth.displayName.lastIndexOf(' ')), 
    //lastName: auth.displayName.split(auth.displayName.lastIndexOf(' '), auth.displayName.length), 
    //displayPic: auth.photoURL, 
    //provider:auth.provider 
    //}); 
}); 

これにより、auth.facebook内のデータを見ることができます。