Hide an inline style using angularJS

Question

I need to hide only the inline style( style="float:left;" from ul tag) when data.unlock_scode value is present. ng-show="data.unlock_scode" is working fine in img tag and I can't use the same in ul tag then it will hide the entire ul section.

<ul style="float:left;">
   <li ng-show="data.upfront != ''">Test</li>
</ul>
<img src="u70007.jpg" ng-show="data.unlock_scode" style="float:left;">

Answer 1

You can use ng-style to have condition on your styles

<ul ng-style="{'float': data.unlock_scode ? 'inherit':'left'}">
   <li ng-show="data.upfront != ''">Test</li>
</ul>

Answer 2

Use ng-style

<ul ng-style="!data.unlock_scode" style="float:left;">
  .....
</ul>

better way is not to add inline style instead use ng-class

.someclass{
    add css here..
}

.someotherclass{
   add css here..
}    

ng-class="{someclass: !data.unlock_scode, someotherclass: data.unlock_scode}"