typescript - 使用 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/#/documentation（在页面中搜索renderComponent）和建议的示例（https://github.com/akveo/ng2-smart-table/ blob/master/projects/demo/src/app/pages/examples/custom-edit-view/advanced-example-custom-editor.component.ts）