Вложенный объект Angular 5 и Firestore

Question

У меня есть коллекция огненного шторма с такой структурой:

USERID {
    email: "test@test.com"
    name: "John Doe"
    roles{
        user: true
        editor: true
        admin: false
    }
}

Я могу получить эти данные как коллекцию и отобразить их в виде.

component.ts:

constructor(private afs: AngularFirestore) {}

this.userCollection = this.afs.collection('users')
this.users = this.userCollection.valueChanges()

component.html

 <tr *ngFor="let user of users | async;>
      <td>{{ user.firstName }}</td>
      <td>{{ user.lastName }}</td>
      <td>{{ user.roles }}</td>
      <td>{{ user.email }}</td>
      <td>{{ user.job }}</td>
 </tr>

Все отображается правильно, кроме «ролей», которые отображаются как [объект объекта]

Я могу отобразить роли, изменив строку на

{{ user.roles | json }}

, но отображаются только необработанные данные JSON.Как я могу отобразить роли, которые установлены в true?Есть ли лучший способ структурировать мои данные?

Answer 1

роль тоже объект. я могу получить собственность вот так

 <tr *ngFor="let user of users | async;>
  <td>{{ user.firstName }}</td>
  <td>{{ user.lastName }}</td>
  <td>{{ user.roles.user }}</td>
  <td>{{ user.email }}</td>
  <td>{{ user.job }}</td></tr>