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 数据获得的是一个对象(而不是原始类型，例如字符串、数字、 bool 值等)，您应该使用 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)