Question

我想显示一个Firestore模型，其中包含配置文件名称和使用Angular 6描述主题标签的列表。

作为Firestore的新手，我了解到我应该像这样建模： enter image description here

members {
          id: xyz
                  {
                    name: Jones;
                    hashtag: {
                              global: true,
                              digital: true
                             }
          ...
         }

现在，我尝试了解如何在组件列表中显示每个主题标签属性的键。我当前的代码始终将[object Object]显示为结果。我的组件代码是：

import { Component } from '@angular/core';
import { AngularFirestore } from 'angularfire2/firestore';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  items$: Observable<any[]>;
  constructor(db: AngularFirestore) {
    this.items$ = db.collection('Members').valueChanges();
    console.log(this.items$);
  }
}

我的模板代码是：

<p>names and their interests</p>
<div *ngFor="let item of items$ | async">
  <h4>{{item.name}}</h4>
  <ul>
    <li>{{item.hashtag}}</li>
  </ul>
</div>

我该如何解决？

Answer 1

认为您正在寻找（Angular 6.1）：

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

这将获得密钥和item.hastag的值，并将其用于hastag中。

如何使用Angular检索和显示嵌入式Firestore对象？

1 个答案: