Question

我想通过ng-class向UI选择的特定LI元素添加一个类，但我无法这样做。

示例 -

 <ui-select  ng-model="selected" theme="select2">
  <ui-select-match placeholder="Select">{{$select.selected.name}}
  </ui-select-match>   
 <ui-select-choices  repeat="student in studentList | filter:  $select.search" ng-class="{{student.name}}  == 'ABC' ? 'found' : 'not_Found' ">     {{student.name}}          
</ui-select-choices>   
 </ui-select>

如果有任何想法，请帮助我

Answer 1

我将ng-class指令放在ui-select指令的父指令中，然后在我的css文件中使用类选择器来选择ui-select中的子元素。例：

<div ng-class="{'some-class': condition}">
 <ui-select...></ui-select>
</div>

CSS：

.some-class a { border-color: red}

希望它有所帮助！

Answer 2

您不应将插值使用指令：

您应该避免动态更改插值字符串的内容（例如属性值或文本节点）。在评估原始字符串时，您的更改可能会被覆盖。此限制适用于通过JavaScript直接更改内容或间接使用指令。

来源：Docs

你应该试试这个：

<ui-select  ng-model="selected" theme="select2">
    <ui-select-match placeholder="Select">{{$select.selected.name}}
    </ui-select-match>   
    <ui-select-choices repeat="student in studentList | filter: $select.search" ng-class="student.name == 'ABC' ? 'found' : 'not_Found' ">
        <span ng-bind="student.name"></span>
    </ui-select-choices>   
 </ui-select>

注意：还将其他插值更改为ngBind指令，因为它有点faster。

ng-class无法正确选择UI

2 个答案: