Ionic 2 Angularfire2-将对象列表从数据库添加到FirebaseListObservable

Ionic 2 Angularfire2-将对象列表从数据库添加到FirebaseListObservable,firebase,firebase-realtime-database,ionic2,angularfire2,Firebase,Firebase Realtime Database,Ionic2,Angularfire2,我试图在我的Firebase数据库中显示对象列表,但我很难将这些对象添加到FirebaseListObservable 这是我的密码: products: FirebaseListObservable<any[]>; this.db.list('products/' + this.user.uid, { preserveSnapshot: true}) .subscribe(snapshots=>{

我试图在我的Firebase数据库中显示对象列表,但我很难将这些对象添加到FirebaseListObservable

这是我的密码:

    products: FirebaseListObservable<any[]>;

    this.db.list('products/' + this.user.uid, { preserveSnapshot: true})
                .subscribe(snapshots=>{
                  var jsonObject = [];
                  snapshots.forEach(snapshot => {
                    jsonObject.push(snapshot.val());
                  });
                  this.products = jsonObject;
    });

products:FirebaseListObservable

您的产品是FirebaseListObservable,但是,您的jsonObject是一个数组,因此您不能让this.products=jsonObject

也许你应该像下面这样做:

products: Observable<any[]>;
this.products = this.db.list('products/' + this.user.uid, { preserveSnapshot: true})
            .map(snapshots=>{
             return snapshots.map(snapshot => {
                return snapshot.val();
              });
});
产品:可见;
this.products=this.db.list('products/'+this.user.uid,{preservesnashot:true})
.map(快照=>{
返回快照.map(快照=>{
返回snapshot.val();
});
});

您的产品是可以观察到的FirebaseList,但是,您的jsonObject是一个数组,因此您不能让this.products=jsonObject

也许你应该像下面这样做:

products: Observable<any[]>;
this.products = this.db.list('products/' + this.user.uid, { preserveSnapshot: true})
            .map(snapshots=>{
             return snapshots.map(snapshot => {
                return snapshot.val();
              });
});
产品:可见;
this.products=this.db.list('products/'+this.user.uid,{preservesnashot:true})
.map(快照=>{
返回快照.map(快照=>{
返回snapshot.val();
});
});

this.db.list
this.db.list
this.db.listthis returns Observables?我试图实现您的解决方案,但在您的.ts文件的html页面中看不到任何产品,首先使用以下代码打印数组,以检查数组是否存在:
this.products.subscribe((项)=>console.log(项))
您可以在ngOnInit()方法中添加此代码。我的HTML中有一个键入错误。现在可以了:)谢谢你的回答!我试图实现您的解决方案,但在我的html页面中看不到任何产品在您的.ts文件中,首先使用以下代码打印数组,以检查数组是否存在:
this.products.subscribe((items)=>console.log(items))
您可以在ngOnInit()方法中添加此代码我的html中有一个键入错误。现在可以了:)谢谢你的回答!