ng-matero / extensions

Angular Material Extensions Library.
https://ng-matero.github.io/extensions/
MIT License
388 stars 48 forks source link

[Grid] re-render data with custom (dynamic) class on columns #276

Closed SYS64738 closed 2 months ago

SYS64738 commented 2 months ago

Hi, I have a grid with a dynamic class on columns:

highLitedColumns: string[] = [];
...
class: (data: any, colDef: MtxGridColumn | undefined) => !!colDef && this.highlitedColumns.includes(colDef.field) ? 'success : ''
...

there's a way to re-evaluate (render) the grid when something change in highLitedColumns array ? it works only if I reload data (or move to next page).

I mean a behavior like "ngClass". I already try this.grid.table.renderRows() without success.

Thank you very much!

nzbin commented 2 months ago

Can you provide an online example?

SYS64738 commented 2 months ago

of course, here is an example.

btw: the same occurs with rowClassFormatter (I included it in the example); if class condition changes after first render nothing happens, it seems that classes are evaluated once by render.

one last thing I found on rowClassFormatter: it seems that rowHover is always enabled on it, even when explicit disabled in configuration; you can see it in the example on yellow row. in your grid examples this doesn't occurs...

https://stackblitz.com/edit/angular-tqpzbd?file=src%2Fapp%2Fapp.component.ts

thank you!

nzbin commented 2 months ago

I forked the example and update it, please check the comments. https://stackblitz.com/edit/angular-4x4ryo?file=src%2Fapp%2Fapp.component.ts

it seems that rowHover is always enabled on it

For Material >= 15, it has a redundant hover state style, you should fix it by yourself. I only fixed this issue above v16.