无法从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>

我收到此错误

  

内联模板：8：12引起：找不到不同的支持对象＆＃39; [object Object]＆＃39;类型＆＃39;对象＆＃39;。 NgFor仅支持绑定到Iterables，例如Arrays。

Answer 1

如果我没有弄错，你想要显示艺术家版本中的一系列按键：围绕着这些，b边和稀有等等。

因此，您可以从releases对象中提取这些键：

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>

Answer 2

从你的firebase结构artistitemsid你得到一个obeject {}，你不能在一个对象上使用ngFor。

但您应该可以直接使用插值来访问这些值：

{{artistitemsid.gore.value}}

现在，如果它是一个对象数组，则取决于值，然后您可以使用ngFor

进行迭代

或者您可以获取所获得的值并将其添加到数组中：

你从firebase得到的东西就像

{aroundthefur:{},b-sides&rarities:{},...}

 this.artistitems.subscribe(snapshot => {
      this.artistvalues = snapshot.val();
      this.artistitemsid = this.artistvalues.releases;

      const myArray = [];
        for (let key in this.artistitemsid){
          myArray.push(this.artistitemsid[key]);
        }
        this.items = myArray;  // items  is declared outside so you can use it on a ngFor

      console.log(myArray)
    });

使用ngOnInit中的函数，你会得到类似的东西：

items = [aroundthefur:{},b-sides&rarities:{},...]

可以用作

<ul>
    <li *ngFor="let item of items">
      {{ item.value }}  // basically is aroundthefur.value
    </li>
  </ul>