AngularFire2检索对象数据不起作用，但列表数据起作用
AngularFire2检索对象数据不起作用，但列表数据起作用
提问于 2017-06-12 18:03:13
我正在尝试使用类型记录中的AngularFire2从Firebase读取数据。我的代码在检索数据列表时使用异步管道，但在获取对象时，我无法访问内容。
Firebase上的数据结构：(myapp.firebaseio.com/LeagueStandings)
代码子集：
import { Component } from '@angular/core';
import { AngularFireDatabase, FirebaseObjectObservable } from 'angularfire2/database';
Standings: FirebaseObjectObservable<any[]>;
constructor(public FirebaseData:AngularFireDatabase) {
this.Standings = FirebaseData.object('/LeagueStandings');
// Added the following to see the debug
this.Standings.subscribe(data => {
console.log(data);
});
}HTML示例位：
<ion-col><ion-badge color="secondary">{{Standings.Wins | async }}</ion-badge></ion-col>问题是数据从来没有显示出来。然而，使用FirebaseData.list的数组数据(例如，单个游戏统计数据)上的相同类型的东西确实有效。我不知道如何轻松提取页面要显示的数据结构。
添加控制台转储显示从Firebase返回的数据，但我的home.html没有更新。
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-06-13 22:04:22
显然，仔细阅读AngularFire2文档将解决这个问题。我注意到文档是如何显示数据的，并将代码更改为匹配，并且它工作正常。HTML是我要改变的全部。
import { Component } from '@angular/core';
import { AngularFireDatabase, FirebaseObjectObservable } from 'angularfire2/database';
Standings: FirebaseObjectObservable<any[]>;
constructor(public FirebaseData:AngularFireDatabase) {
this.Standings = FirebaseData.object('/LeagueStandings');
}HTML示例位：
<ion-col><ion-badge color="secondary">{{Standings.Wins | async }}</ion-badge></ion-col>对以下方面的改动：
<ion-col><ion-badge color="secondary">{{ (Standings | async)?.Wins }}</ion-badge></ion-col>(积分榜)？.Wins为更正。使用异步管道等待对象，然后使用可选字段(?)然后是字段(.Wins)。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/44505956
复制相关文章
相似问题
腾讯云开发者
