2017-10-20 7 views
2

イム作成するユーザープロファイルを表示する:それは働いているfirebaseからユーザープロファイルデータを取得し、このコードでfirebaseに

username: string 
msgnumber: number 
level: number 

constructor(private fire:AngularFireAuth,private db :AngularFireDatabase,public navCtrl: NavController, public navParams: NavParams) { 

} 

createProfile() { 

    this.fire.authState.take(1).subscribe(auth => { 

    this.db.object(`profile/${auth.uid}`).set({ 
     username: this.username, 
     msgnumber: 0, 
     level: 0 
    }).then(() => 
     this.navCtrl.setRoot(TabsPage)); 
    }) 
} 

。今私はユーザーのデータを取って、自分のプロフィールページに表示しようとしています。

import { Component } from '@angular/core'; 
import { NavController } from 'ionic-angular'; 
import {AngularFireAuth} from 'angularfire2/auth'; 
import {AngularFireDatabase,FirebaseListObservable} from 'angularfire2/database'; 


@Component({ 
    selector: 'page-profile', 
    templateUrl: 'profile.html' 
}) 

export class ProfilePage { 
    profileData: FirebaseListObservable<any> 

    constructor(private fire:AngularFireAuth,private db :AngularFireDatabase,public navCtrl: NavController) { 

     this.fire.authState.subscribe(auth =>{ 
      this.profileData = this.db.list(`profile/${auth.uid}`); 
      console.log(this.profileData); 
     }); 
    } 
} 

私はこれを試しましたが、動作していないようです。問題は、私がオブジェクト/リストオブザーバブルの考え方を得ることができなかったか、または一般的にデータを取り出す方法とオブジェクトオブザーバブルがどのように働いているかということです。チェックされたインターネットと私は人々がデータを取得するためにそれらを使用していると思いますか?

データベース: db

答えて

1

あなたは正しい道にしています。最終的にデータを取得するにはsubscribeに、this.profileDataに割り当てられた2番目の観測値に必要です。このよう

this.fire.authState.subscribe(auth => { 
    // subscribe to the observable 
    this.db.list(`profile/${auth.uid}`).valueChanges().subscribe(profile => { 
    console.log(profile); 
    }); 
}); 

は今、あなたはあなたを提供していますrxjs switchMapオペレータを利用することができますネストを避けるために。

結果は次のようになります。answer.iため

this.profileData$ = this.fire.authState.switchMap(auth => this.db.list(`profile/${auth.uid}`).valueChanges()); 
this.profileData$.subscribe(profile => console.log(profile)) 
+0

おかげで(...)これを試してみましたが、_this.db.listまし購読は、関数エラーではありません。何か考えていますか? –

+0

どのバージョンの 'angularfire2'を使用していますか? – Orlandster

+0

最新のものは、私が –

関連する問題