我正在使用Angular和AngularFire从Firestore数据库获取数据。
我有两个服务“ itemsService”，“ detailsItemService”，它们从Firestore集合“ items”和“ detailsItem”收集并返回数据；
// it's the same for detailsItemService
[...]
export class itemsService {
private items: Observable<Item[]>;
constructor(
private db: AngularFirestore,
private userService: userService
) {
this.items = db.collection<Item>(
'items',
ref => ref.where('userID', '==', this.userService.userID)
)
.snapshotChanges()
.pipe(
map(array => {
return array.map(item => {
return {
uid: item.payload.doc.id,
...item.payload.doc.data()
} as Item;
});
});
);
}
getItems() {
return this.applications;
}
}
然后在我的控制器“ itemsCtrl”中，进行订阅以获取带有uid的“ Items”，然后继续进行forEach以便为每个项及其uid订阅“ detailsItem”。
[...]
export itemsCtrl implements OnInit {
public items = [];
constructor(
private itemsService: itemsService
) {
const items = [];
this.itemsService.getItems().subscribe(items => {
items.forEach((item, key) => {
items[key] = item;
this.detailsItemService.getDetails(item.uid).subscribe(details => {
items[key].details = details;
});
}
this.items = items;
});
}
[...]
}
但是在我看来，页面开始加载时出现了未定义的属性。
<div *ngFor="let item of items">
<input [(ngModel)]="item.details.name">
</div>
然后我得到这个错误：
ERROR TypeError: Cannot read property 'name' of undefined 未定义ID的“详细信息”
感谢您的帮助：'）
直接使用this.items（getDetails是异步函数，this.items =项目将在订阅完成之前进行评估）：
this.itemsService.getItems().subscribe(items => {
items.forEach((item, key) => {
this.items[key] = item;
this.detailsItemService.getDetails(item.uid).subscribe(details => {
this.items[key].details = details;
});
}
});
并检查是否存在详细信息：
<input *ngIf="item.details" [(ngModel)]="item.details.name">
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句