Pass CSS value with ngStyle

Issue

I’ve got a service sending a value, which I need it to be passed to the CSS file so I can control how much a meter gauge moves.
The value is between 0 and 0.5, and changes the

transform:rotate( {NUMBER} turn)

On classes dynamically chosen with a previous nGclass.

Example: If my var is 0.5, I need the resulting CSS code to be

transform:rotate(.5turn)

How can I manage this?

I’ve tried

[ngStyle]="{'transform:rotate(.5turn)': dashService.variable}"

And other variations of the same idea but it doesn’t seem to work.

Solution

You can use interpolation syntax:

[ngStyle]="{ 'transform': 'rotate(' + dashService.variable + 'turn)': }"

Answered By – StepUp

Answer Checked By – Gilberto Lyons (AngularFixing Admin)

Leave a Reply

Your email address will not be published.