Question

我使用以下代码在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

Answer 1

你正确的方式。要最终检索subscribe所需的数据到第this.profileData分配的第二个可观察数据。

像这样：

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

现在为了避免嵌套，您可以使用rxjs为您提供的switchMap运算符。

结果如下：

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

从firebase检索用户配置文件数据并显示

1 个答案: