Ngx-datatable set column width dynamically
I got it working, though it was very trivial:
I store the width values of the columns in an
object which acts as a dictionary.
The problem was that the grid was rendered before my ajax call has finished and could not make the grid to redraw itself.
So I set the initial value of my dictionary object to
null and put an
*ngIf on the grid:
This way the rendering happens only after the values of the dictionary are ready to be used.
Angular ngx-datatable fixed column width is not working
As mentioned in the documentation, default value of the
minWidth property is
100. IMHO, if we try to define a
width value smaller than
100, then we need to define the
minWidth property too.
Minimum width of the column in pixels. Default value: 100
How to set columnMode/... of a ngx-datatable without binding to ViewModel?
You can apply
columnMode="force" for your
Sample Demo on StackBlitz
1.0 According to ngx-datatable DataTableComponent (Line 186):
@Input() columnMode: ColumnMode | keyof typeof ColumnMode = ColumnMode.standard;
It is acceptable to pass
columnMode with a
For the detailed explanation for the
typeof on a enum, you may refer to @Yogesh's answer on What does "keyof typeof" mean in TypeScript?
2.0 According to Angular - Property Binding docs,
The brackets, , cause Angular to evaluate the right-hand side of the assignment as a dynamic expression. Without the brackets, Angular treats the right-hand side as a string literal and sets the property to that static value.
how change a style of ngx datatable column on scroll?
You can use condition in the
ngClass and apply the class based on it:
<div [ngClass]="flag ? 'applyStyle' : 'noStyle'"> </div>
If this doesn't work, there might be an issue with view encapsulation. You need to remove it. You should check this thread, it explains how to do that in simple steps.
Also, make sure your change detection strategy is set to default or make change detection if it is
OnPush which will update the view properties.