ankit pachori ankit pachori - 2 months ago 9
TypeScript Question

How to set dynamic value in css?

I want to pass dynamic css value.I want to change css value on index basis.

<hr style="width: 150px;float: left;position: absolute;z-index: 99999;top: 28%;margin-left:110px; left: (index == 0) ? '110px' : '145px'%;">


but the here "left" value is not taken by html.
How can i fix it?

Answer

To make angular evaluate the expression once, use the double curly braces as usual:

<hr style="width: 150px;float: left;position: absolute;z-index: 99999;top: 28%;margin-left:110px; left: {{(index == 0) ? '110px' : '145px'}};">

To do it continuously, try this:

<hr style="width: 150px;float: left;position: absolute;z-index: 99999;top: 28%;margin-left:110px;" [style.left]="(index == 0) ? '110px' : '145px'">
Comments