Question

我正在尝试使用Firebase的实时数据库，我已经为这些书籍及其价格创建了一个API。

{  
  "Books":[
        {"Angular 4": "$9.99"},
        {"HTML 5": "$10.99"},
        {"CSS3": "$21.90"}
    ]
}

在npm中从angularfire2包导入AngularFirebase的所有必需依赖项之后，我编写了以下代码来从数据库中检索值：

booklists: AngularFireList<any[]>;
booklistCollection: Observable<any[]>;

constructor(public angularFireDatabase: AngularFireDatabase) {
    this.booklists = angularFireDatabase.list('/Books');
    this.booklistCollection = this.booklists.snapshotChanges();
}

在app.component.html中，我编写了以下代码来迭代observable。

<div>
  <ul>
    <li *ngFor="let booklist of booklistCollection | async">
      {{ booklist.key }} : {{ booklist.value }}
    </li>
  </ul>
</div>

但是，输出只包含键而不是值。

我无法找到同时获取键和值的方法。我知道可以使用 AngularFirebaseList 的 valueChanges（）方法单独获取值，但我需要一种方法来同时获取键和值。

Answer 1

我解决了同样的问题。 payload.val()返回对象

<div>
  <ul>
    <li *ngFor="let booklist of booklistCollection | async">
      {{ booklist.key }} : {{ booklist?.payload?.val()?.value }}
    </li>
  </ul>
</div>

AngularFirebaseList获取键和值

1 个答案: