Search code examples
javascriptangularjsangularjs-ng-repeatng-class

How to add ng-class based on multiple variable comparison?

My select dropdown, needs the class of btn-success if 2 variables form a JSON object != null.

What I've tried so far which isn't working, basically if term.tag and term.id are not null, add the class btn-success to the select.

This is inside of an ng-repeat term in terms is the JSON data.

<select ng-class="{ 'btn-success': term.tag != null && term.id != null }">
    <option value="companies">companies</option>
    <option value="news">news</option>
    <option value="people">people</option>
    <option value="products">products</option>
</select>

How would you go about this?

Solution

  • Change your HTML to something like this:

    <select ng-class="getButtonClass()">

    And add a function in your controller:

    $scope.getButtonClass = function() {
    if (term.tag && term.id) {
        return 'btn-success';
    }
});