Javascript 如何显示我的对象可观察数据

我正在通过angularfire2应用程序中的url传递id，并在onInit方法中收集它

  ngOnInit() {
    // subscribe to router event
    this.activatedRoute.params.subscribe((params: Params) => {
      this.groupId = params['groupId'];
      // grab specific group
      this.group = this.af.database.object('/groups/'+this.groupId);
      this.group.subscribe(console.log);
    });
  }

console.log完美地显示了我想要的对象，但是我不能用

{{group.data}}

在HTML中显示它，而是得到字符串

[object object]

我使用一个可观察的列表也得到了同样的结果，但在控制台日志中，我得到了一组我想要的数据数组，而不是一个对象，所以如果可能的话，一个对象更可取

我必须做什么才能显示数据

console.log(JSON.stringify(yourObject));

或者，如果您想记录RXJS流中省略的内容

this.activatedRoute.params.do(x => console.log(x)).subscribe 

如果要在HTML中显示要使用JSON管道的对象

而不是

{{ yourObject }}

你想要

{{ yourObject | json }}

如果要输出列表

<ul>
    <li *ngFor="let item in list">
        {{ item | json }}
    </li>
</ul>

{{item | json}}

根据您提供的代码片段，它看起来像

组

是可观察的，因此您可以在模板中使用

异步

管道，如下所示：

<div>
   {{group | async}}
</div>

{{组|异步}}

谢谢你的建议，但现在我得到了：异常：未捕获（承诺中）：错误：./GroupsComponent类GroupsComponent-内联模板中的错误：5:29原因是：在我添加JSON管道时将循环结构转换为JSON。这里解释了您得到此结果的原因。。我将为您找到一个解决方案发生这种情况的原因是| json管道在引擎盖下只是使用json.stringify（它将对象转换为字符串以便您可以读取它）。。如果向JSON.stringify传递一个带有循环引用（指向自身的引用）的JSON对象，则会发生此错误-仍在寻找修复方法我能想到的最好方法是。。它有各种各样的解决方案-其中大多数涉及使用库（如dojo）来解决此问题您可以将感兴趣的属性字符串化，或者只需将每个属性记录下来并在浏览器控制台选项卡中检查对象-最好-如果您不知道对象上有什么属性，请使用object.keys（您的对象）请发布您的模型，演示

数据

。如果不知道该数据是什么样子，则无法准确诊断此问题。例如，如果

数据

是类似列表的对象，则答案不同于

数据

是简单的键值对。