5

1

Above Is my Data Structure in Firebase's Firestore db. I can successfully pull data and put it into the ng2 smart table using these settings:

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'
  },
};

but when I add a place for roles

roles: {
    title: 'Role',
},

the output is

enter image description here

I want to be able to display the users role or roles if they have more than one, and be able to update them from the table.

Community
  • 1
  • 1
bjwhip
  • 407
  • 1
  • 9
  • 18

1 Answers1

4

Since what you get for the roles data is an Object (and not a primitive, e.g. a string, a number, a boolean, etc.) you should use a renderComponent attribute. It will allow you to pass a Custom component to render into the cell (i.e. the type shall be custom).

See the doc https://akveo.github.io/ng2-smart-table/#/documentation (search for renderComponent in the page) and the proposed example (https://github.com/akveo/ng2-smart-table/blob/master/projects/demo/src/app/pages/examples/custom-edit-view/advanced-example-custom-editor.component.ts)

Babak
  • 1,274
  • 15
  • 18
Renaud Tarnec
  • 79,263
  • 10
  • 95
  • 121