为什么赢了';Firebase实时数据库显示的t列表?使用Ionic和AngularFire2

为什么赢了';Firebase实时数据库显示的t列表?使用Ionic和AngularFire2,angular,firebase,firebase-realtime-database,ionic3,angularfire2,Angular,Firebase,Firebase Realtime Database,Ionic3,Angularfire2,我很困惑为什么我的列表不会显示 我使用的是Firebase实时数据库,检索和显示具有最简单结构的节点下的数据字段一点问题都没有。例如,从中检索数据 -|菜系-| itemId-key:value效果很好 在烹饪方面,我可以加一个 items: Observable<any[]>; 在构造函数中,此HTML <ion-list> <ion-item class="text" *ngFor="let item of items | async"> {{item.

我很困惑为什么我的列表不会显示

我使用的是Firebase实时数据库,检索和显示具有最简单结构的节点下的数据字段一点问题都没有。例如,从中检索数据
-|菜系-| itemId-key:value
效果很好

在烹饪方面,我可以加一个

items: Observable<any[]>;
在构造函数中,此HTML

<ion-list>
<ion-item class="text" *ngFor="let item of items | async">
{{item.name}}
</ion-item>
</ion-list>
我也试过了

this.items = database.list('cuisines/' + this.userId).valueChanges();
所有这些都使用与上面相同的HTML。我没有发现明显的错误。当我
console.log(this.items)
时,我得到以下信息:

Observable {_isScalar: false, source: Observable, operator: MapOperator}
operator
:
MapOperator {project: ƒ, thisArg: undefined}
source
:
Observable {_isScalar: false, source: Observable, operator: DistinctUntilChangedOperator}
_isScalar
:
false
__proto__
:
Object

目前我所有的规则都尽可能公开,所以这不是问题所在。只是我的列表没有显示出来。通过多次尝试和错误,我将其隔离到数据库路径。当我在数据库路径的代码中实际输入
userId
而不是
时,我的列表也会正确显示。如果您有任何帮助,我们将不胜感激。

问题出在这个模块中:

constructor(private database: AngularFireDatabase, private auth: AngularFireAuth) {
  this.auth.authState.subscribe(user => {
    if(user) this.userId = user.uid
  });
  this.items = database.list(`cuisines/${this.userId}`).valueChanges();
您的
this.auth.authState.subscribe
注册回调以捕获
this.userId
;但是,在您的订户被调用之前,您立即在下一行使用
this.userId
(即使该值已经可用,您的回调直到事件循环的下一个勾号才会被调用)

您只需移动此行:

this.items = database.list(`cuisines/${this.userId}`).valueChanges();
在订阅回调中。这意味着您的用户将等待片刻以查看数据,因此您可能需要加载程序或空消息

constructor(private database: AngularFireDatabase, private auth: AngularFireAuth) {
  this.auth.authState.subscribe(user => {
    if(user) this.userId = user.uid
  });
  this.items = database.list(`cuisines/${this.userId}`).valueChanges();
this.items = database.list(`cuisines/${this.userId}`).valueChanges();