在AngularFire2中获取FirebaseListObservable

Question

我将我的应用程序连接到使用AngularFire2包的Firebase。我知道这是勾搭上了，因为当我做了一个组件如下：

constructor(af: AngularFire) { 
    this.items = af.database.list('/items'); 
    this.items.push({ attr: 'value' }); 
} 

的项目推到火力地堡正确的名单。所以连接就在那里。但是，当尝试循环并在模板中显示它们时，this.items为空。还需要做什么才能显示这些项目？

<div *ngFor="let item of items | async">{{ item.attr }}</div> 

编辑

下面是实际的代码要点的链接，但它确实几乎完全一样的东西在这里这个问题。

https://gist.github.com/pjlamb12/0c3c680e3481c222f9b253224c7dd439

Answer 1

您需要订阅列表，所以你需要做这样的事情：

因此，如果您在数据库中有像这样的项目清单：

-items 
    -item1 
     -name: 'mycoolitem' 
    -item2 
     -name: 'mycoolitem2' 

然后在您的TS文件：

//Items would have to be a list observable 
items: FirebaseListObservable<any>; 
//create an array for the returned items 
itemsReturned: Array<any>; 

constructor(af: AngularFire) { 
    this.items = af.database.list('/items'); 
    this.items.subscribe((res) => { 
     this.itemsReturned = res; 
    }); 
} 

在你的HTML

然后：

<div *ngFor="let item of itemsReturned | async">{{ item.name }}</div> 

这将返回：

mycoolitem 
mycoolitem2 

希望这有助于！