我正在使用nativescript-firebase-plugin从firebase获取数据。数据库实例的屏幕截图如下。
我正在跟踪Jen Looper's blog.中的一个示例,以下是 firebase.service.ts 的代码:
getMyWishList(): Observable<any> {
return new Observable((observer: any) => {
let path = 'movie/';
let onValueEvent = (snapshot: any) => {
this.ngZone.run(() => {
// console.log('snapshot'+ snapshot.value);
let results = this.handleSnapshot(snapshot.value);
console.log('jjjj');
observer.next(results);
});
};
firebase.addValueEventListener(onValueEvent, `/${path}`);
});
}
handleSnapshot(data: any) {
this._allItems = [];
if (data) {
for (let id in data) {
this._allItems.push(data);
}
this.publishUpdates();
}
return this._allItems;
}
publishUpdates() {
// here, we sort must emit a *new* value (immutability!)
this._allItems.sort(function(a, b) {
if (a.name < b.name) return -1;
if (a.name > b.name) return 1;
return 0;
});
this.items.next([...this._allItems]);
}
使用
在我的home.componenet.ts中调用了此服务`
this.datas$ = <any>this.firebaseService.getMyWishList();
`
然后在 home.component.html 中尝试使用nativescript listview呈现数据库实例数据。
<StackLayout class="card">
<ListView [items]="datas$ | async" height="300">
<GridLayout>
<ng-template let-item="item">
<GridLayout columns="auto,*,auto">
<Label class="m-5" col="1" [text]="item.link"></Label> //Line 1
<Label class="m-5" col="1" [text]="item.name"></Label> //Line2
</GridLayout>
</ng-template>
</GridLayout>
</ListView>
</StackLayout>
`
但是当我使用item.link或item.name时listView是空的。但是当我使用item.video1.link时它可以工作。现在我推断电影文档是listView中的项目,但是我需要在其中创建文档 / movie作为项并动态呈现其值。 另外,如果listView以这种方式工作,那么它有什么用,因为我们只能呈现一行文档。请帮助我在此处查找问题。