Search code examples
htmlcssangularjsangularjs-scope

using angular to modify css class properties

I have a css class 'suggestions-list'in which I have height: initial; in my angularjs code in a condition I want to change height: inherit; how can I modify this css class using angular?

in my CSS file I have :

.suggestions-list {
    position: absolute;
    list-style-type: none;
    margin: 0 0 0 35px;
    padding: 0;
    overflow: scroll;
    height: initial;
    width: 250px;
    border-bottom: 50px;
}

and this is my HTML:

<ul class="suggestions-list" ng-show="myVar">
     <li ng-repeat="suggestion in suggestions track by $index" ng-class="{active : selectedIndex === $index}" ng-click="AssignValueAndHide($index)">{{suggestion}}</li>
</ul>
Solution

  • Use ng-style 

    <div ng-style="{height: (condition?'initial':'inherit')}"></div>