0

如果选中该项目,我想有条件地使用 ngClass。基本上,如果特定模型的数据已设置并且视觉上用户将看到在单选按钮或复选框上选择的项目,则将添加一个类也允许我为选中/设置不同的 css选定的项目。我正在使用http://vitalets.github.io/checklist-model/来设置复选框,并且只是一个常规的 ngRepeat 用于单选按钮。在复选框模型的示例中,它们显示已选中的复选框集中的用户项。我希望用户加载页面并选择已经选择的项目,但还要将一个类添加到仅选择的项目中。我不想依赖“更改”功能,因为这需要用户采取行动。我希望它绑定到页面或在 ngClass 中。

我研究了如何在 AngularJS 中有条件地应用 CSS 样式? 但这似乎对我的情况没有帮助。

任何帮助表示赞赏。

4

1 回答 1

3

您可以像这样有条件地应用一个类:

<div ng-repeat="animal in animals">
    <input type="checkbox" ng-model="animal.isHungry" ng-class="{'when-condition-true': animal.isHungry}">
</div>

当当前的属性在控制器中为真when-condition-true时,将应用该类。isHungryanimal

或者也可以有条件地切换一个类,如下所示:

<div ng-repeat="animal in animals">
    <input type="checkbox" ng-model="animal.isHungry" ng-class="animal.isHungry ? 'when-condition-true' : 'when-condition-false'">
</div>

这两种方法都适用于页面加载,不需要用户交互。但是当他们选中和取消选中时,您的课程将自动添加或删除。

于 2014-02-24T20:44:51.980 回答