使用 AngularFire 和 Firestore 显示带有 Ng2 智能表的嵌套对象

Question

以上是我在 Firebase 的 Firestore 数据库中的数据结构。我可以使用以下设置成功提取数据并将其放入 ng2 智能表中：

export const userTableSettings = {
  delete: {
confirmDelete: true,
deleteButtonContent: '<i class="ft-x danger font-medium-1 mr-2"></i>'
  },
  add: {
confirmCreate: true,
  },
  edit: {
confirmSave: true,
editButtonContent: '<i class="ft-edit-2 info font-medium-1 mr-2"></i>'
  },
  firstName: {
title: 'Full Name',
  },
  lastName: {
title: 'User Name',
  },
  email: {
title: 'Email',
  },
},
  attr: {
    class: 'table table-responsive'
  },
};

但是当我为角色添加位置时

roles: {
    title: 'Role',
},

输出是

我希望能够显示一个或多个用户角色（如果他们有多个角色），并且能够从表中更新它们。

Answer 1

由于您获得的roles数据是一个对象（而不是基元，例如字符串、数字、布尔值等），因此您应该使用属性renderComponent。它将允许您传递自定义组件以渲染到单元格中（即类型应为custom）。

请参阅文档https://akveo.github.io/ng2-smart-table/#/documentationrenderComponent （在页面中搜索）和建议的示例（ https://github.com/akveo/ng2-smart-table/ blob/master/projects/demo/src/app/pages/examples/custom-edit-view/advanced-example-custom-editor.component.ts）