ngx-datatable - how to define 'cell class' for columns at runtime

Question

<ngx-datatable
    id="ngxdatatable"
    class='material striped'
    [rows]="rows"
    [columns] ="columns"
>
</ngx-datatable>

I tried to bind columns, which columns are getting at run time using columns properties from class object. I want to style a specific column using cell class using css. How this can be achieved. Please help

Ranunculus

Answer 1

I would recommend looking at some of the source code for styling header and column cells as well as how to create column templates, such as:

https://github.com/swimlane/ngx-datatable/blob/master/demo/basic/css.component.ts and https://github.com/swimlane/ngx-datatable/blob/master/demo/basic/row-detail.component.ts

You can style the column headers by adding the [headerClass]="insertYourCssClassName" inside the column template tag like this:

<ngx-datatable-column
    name="ID"
    prop="id"
    [headerClass]="insertYourCssClassNameHere"
>

Same thing goes for styling the body cells, only with [cellClass] instead of [headerClass].

Staford

If insertYourCssClassNameHere is not a variable, you should set headerClass="insertYourCssClassNameHere", without the [ ] – Eldoneldora