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

Posted 2023-03-13

【中文标题】使用 AngularFire 和 Firestore 使用 Ng2 智能表显示嵌套对象

【英文标题】：Display Nested Object with Ng2 Smart Table using AngularFire and Firestore

【发布时间】：2018-10-21 07:45:58

【问题描述】：

以上是我在 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',
,

输出是

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

【参考方案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）

【讨论】：

github链接有404，可以分享一下for renderComponent