Question

<style>
 .btn.active {
        color: #fff;
        background-color: #FE9A2E;
        border-color: #d58512;
    }
.btn.normal  {
        color: #fff;
        background-color:cornflowerblue;
        border-color: #398439;
    }
</style>

<div  class="btn-group" ng-repeat="list in inputarray" >
 <label   ng-model="ngModel" class='btn'  ng-class="{'btn normal':'{{ngModel}}'== '{{list.score}}' && '{{ngModel}}'== '2','btn active':'{{ngModel}}'== '{{list.score}}' && '{{ngModel}}'!= '2' }"  value ="{{list.score}}" btn-radio="{{list.score}}">{{list.name}}</label>
</div>

所以这里如果用户选择Any Radio按钮，则基于此设置Css
如果满足2个条件，则设置为normal

'{{ngModel}}'== '{{list.score}}' && '{{ngModel}}'== '2'

如果满足2个条件，则设置为活动

'{{ngModel}}'== '{{list.score}}' && '{{ngModel}}'!= '2'

如果不满足此条件，则应用默认类

所以我面临的问题是，当我看到第一个条件满足时，它没有显示在预期中即使满足正常条件仍然显示活动样式

请任何人帮我纠正我的代码

Answer 1

尝试删除'{{}}'。

<强> E.g。

<label class="btn" 
       ng-class="{'btn normal': ngModel == list.score && ngModel == '2', 
                   'btn active': ngModel == list.score && ngModel != '2'}"  
       btn-radio="{{list.score}}">
    {{list.name}}
</label>

注意 ng-model和value不适用于label元素，因此我将其删除了。

希望它有所帮助。

ng-class条件不起作用

1 个答案: