angular - 无法从 objectobservable 中获取对象名称

Question

我遇到了一个问题，我想尝试从数据库获取一些数据。我收到数据，但无法显示它，因为它是对象而不是字符串。我怎样才能将这些对象放入字符串中我已经尝试过一些安静的事情，但似乎没有任何效果。

Component.ts

 this.artistitems = af.database.object('/users/'+this.artistid, {preserveSnapshot: true});
    this.artistitems.subscribe(snapshot => {
      this.artistvalues = snapshot.val();
      this.artistitemsid = this.artistvalues.releases;
      console.log(this.artistitemsid)
    });

artistitemsid 在控制台中的输出

aroundthefur:Object
b-sides&rarities:Object
diamondeyes(deluxe):Object
gore:Object
koinoyokan:Object
saturdaynightwrist(explicitversion):Object
thestudioalbumcollection:Object

数据库

我尝试放入 component.html 中的所有内容都会崩溃，我真的不知道如何从对象中获取值而不是获取对象本身

当我的 component.html 中有这个

<ul>
    <li *ngFor="let item of artistitemsid">
      {{ item.value }}
    </li>
  </ul>

我收到此错误

inline template:8:12 caused by: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

Answer 1

如果我没记错的话，您想要显示艺术家发行的 key 列表:aroundthefur、b-sides&rarities 等。

因此，您可以从 releases 对象中提取这些 key :

this.artistitems = af.database.object('/users/'+this.artistid, {preserveSnapshot: true});
this.artistitems.subscribe(snapshot => {
  this.artistvalues = snapshot.val();
  this.artistitemsid = Object.keys(this.artistvalues.releases);
});

并使用 ngFor 迭代结果数组:

<ul>
  <li *ngFor="let item of artistitemsid">
    {{ item}}
  </li>
</ul>