A Dev
A Dev

Reputation: 321

Angular ng-style to alternate table colours

I'm using ng-repeat to create a table. I have an ng-style filter that looks at the values in a table row and if a certain word appears it changes that colour of that row.

The expression that I'm using is:

<tr ng-repeat="a in b" ng-style="a.name == 'user1'?{'background-color':'orange'}:{}">

This is working fine, however what I would like to be able to do is alternate between orange and another colour when there are more than two rows that match so that I don't just have solid blocks of colour in my table.

Is it possible to add another condition to ng-style that looks at if a row is odd or even and then I can alternate the colours of matching rows that way? Or is there another way to do this using css? I'm not sure if I can control css from ng-style?

Upvotes: 1

Views: 5348

Answers (1)

Patrick Kelleter
Patrick Kelleter

Reputation: 2771

you can do it in angular without css for example like this:

<tr ng-repeat="a in b" ng-style="{'background-color': (a.name == 'user1') ? ($index % 2 === 0 ? 'orange' : 'red') : 'auto'}">

but css also has even and odd pseudo classe which could be used here..

Upvotes: 4

Related Questions