sorting in ui grid with grouped columns (cellTemplate)

Question

I have grouped two columns in a ui-grid by using cellTemplate, and it is rendered fine:

  cellTemplate: '<div class="ngCellText">{{row.entity.firstName}} {{row.entity.lastName}}</div>'

Unfortunately, the sorting which worked when the columns were separated (firstName alone, lastName alone) does not work anymore.

I would like to sort the grouped columns in the cellTemplate by sorting by firstName only.

Could you give me some hints to work it (I do not ask for a complete solution)

Answer 1

Personally I would just modify the data prior to populating the grid, for example you could just create your full name property on your initial objects array and use it in the grid instead of the first name + last name.

That way, you will have only one column with the full name and it will be sortable without any additional code.