Home > Net >  How to highlight even rows on PrimeNG table
How to highlight even rows on PrimeNG table

Time:01-18

I am currently working on an Angular project (V.14) with some PrimeNG components, and in this particular component I need to create an striped table. I have worked a lot with boostrap's striped table (which works by applying a different background to even rows than odd ones), and I supposed PrimeNG striped table would work the same, but it is not the case.

I can style my table using inline styles for specific parts of the table, but the rows are created dynamically, so I can't apply different styles for odd an even rows.

I add my scss code next:

:host ::ng-deep p-table {
    tr:nth-child(even) {
        background-color: #ADADAD;
    }
}

But this does not apply, every row has the same background

CodePudding user response:

try the following solution: just change class to p-datatable-table

:host ::ng-deep.p-datatable-table tr:nth-child(even){
    background-color: #000;
}
  • Related