首页 > 解决方案 > AngularJS 动态地改变一个选择的 CSS 类

问题描述

我想在 angularjs 中更改选定选项时动态更改选择组件的外观。

这是我的标记

<select id="actionType" ng-class="$ctrl.pdaProject.actionType.color" ng-options="::(option.code + ' - ' +option.description) for option in $ctrl.actionTypes | orderBy:'code' track by option.code name="actionType" ng-model="$ctrl.pdaProject.actionType" class="editable-input form-control input-sm multicolor" required>
    <option value=""></option>
</select>

$ctrl.pdaProject.actionType.color包含一个 css 类名。颜色类示例

.mark-yellow {
        background-color:#FEE715;
        color: #101820;
}

选择后,我希望页面更改选择的外观,但直到选择松散焦点才会发生。

而是直接使用样式属性并设置背景效果很好。

如何解决?

标签: javascriptcssangularjs

解决方案


你可以这样添加:

[ngClass]="records.length > 0 ? 'fas fa-angle-down' : 'fas fa-angle-up'"

您可以根据需要添加条件。

谢谢


推荐阅读