Conditional ng-style

I am trying to change the border upon condition. I don’t have any errors but it doesn’t work.

<span   ng-style="{{thumb.Selected}} ? {'border' : 'red'}:{'border' : 'black'}" style="display:block; border:solid 1px black;"  >

Answer

You don’t need to put the condition in the curly braces. And as for ng-style here, the way I understand it is you are replacing the border property of the styles that are being applied to this element.

Also if you are trying to change the border I don’t think border: red or border:black are valid css statements. One way to solve this problem is writing it like this

<span ng-style="thumb.selected ? {'border-color': 'red'} : {}" 
style="border:1px solid black">Your text here </span>

You might wanna look into ng-style and css border property

Leave a Reply

Your email address will not be published. Required fields are marked *