Question

我有一个基本的Firestore集合查询。我已将每个返回的项目添加到对象数组中。我真正想做的是在HTML中循环这些并显示键和值。

  firestore_albums = [];

...

  getData() {
    this.db.collection(`users/myid/albums`).get().then((querySnapshot) => {
      querySnapshot.forEach((doc) => {
        const data = doc.data();
        this.firestore_albums.push({ ...data });
      });
    })

HTML

<div *ngFor="let item of firestore_albums | keyvalue">
    {{item.key}}:{{item.value}}
  </div>

不幸的是，这只会返回：

0：[对象对象]

1：[对象对象]

Answer 1

这似乎有效！

<ul>
    <li *ngFor="let item of firestore_albums">
        <ul>
            <li *ngFor="let key of item | keyvalue">
                <div>{{key.key}}</div>
                <div>{{key.value}}</div>
            </li>
        </ul>
    </li>
</ul>

角度-如何显示对象数组

1 个答案: