Question

我有一个用户列表，每个用户都有几个角色作为数组。我使用ag-grid来显示所有用户及其角色，但是ag-grid似乎不适用于我的数据结构。那么，可以在网格表上为每个用户显示所有用户角色的最佳方法是什么？

数据结构：

[
 {
  userId: ''
  username: '',
  userRoles: [
    {roleId: '', roleName: ''},
    ...
  ]
 },
 ...
]

Answer 1

我建议最好的方法是创建一个列组（可折叠）并向其中添加信息。

  {
    headerName: 'Roles',
    children: [
        {
            headerName: "Top Role", field: "topRole", columnGroupShow: 'closed', width: 100, 
            cellRenderer: () => { return 'SuperAdmin'; }
        },
        {
            headerName: "Role: 1", columnGroupShow: 'open', width: 150,
            cellRenderer: () => { return 'SuperAdmin'; }
        },
        {
            headerName: "Role: 2", columnGroupShow: 'open', width: 150,
            cellRenderer: () => { return 'Support'; }
        }
    ]
  }

这是一个简单的示例：https://plnkr.co/edit/i3somDDT9Xdnln32xUy1?p=preview

您可以定义单个字段以显示现有角色中的最高角色，然后通过折叠按钮显示所有用户角色。

More details about column groups

Ag-grid + Angular 6-在列

1 个答案: