小白求教,如何用angular切换样式
1个回答
展开全部
在angular中为我们提供了3种方案处理class:
1:scope变量绑定,如上例。(不推荐使用)
2:字符串数组形式。
3:对象key/value处理。
我们继续其他两种解决方案:
1字符串数组形式是针对class简单变化,具有排斥性的变化,true是什么class,false是什么class,其形如;
function Ctr($scope) {
$scope.isActive = true;
}
<div ng-class="{true: 'active', false: 'inactive'}[isActive]">
</div>
其结果是2中组合,isActive表达式为true,则 active,负责inactive。
2对象key/value处理主要针对复杂的class混合,其形如:
function Ctr($scope) {
}
<div ng-class {'selected': isSelected, 'car': isCar}">
</div>
当 isSelected = true 则增加selected class,
当isCar=true,则增加car class,
1:scope变量绑定,如上例。(不推荐使用)
2:字符串数组形式。
3:对象key/value处理。
我们继续其他两种解决方案:
1字符串数组形式是针对class简单变化,具有排斥性的变化,true是什么class,false是什么class,其形如;
function Ctr($scope) {
$scope.isActive = true;
}
<div ng-class="{true: 'active', false: 'inactive'}[isActive]">
</div>
其结果是2中组合,isActive表达式为true,则 active,负责inactive。
2对象key/value处理主要针对复杂的class混合,其形如:
function Ctr($scope) {
}
<div ng-class {'selected': isSelected, 'car': isCar}">
</div>
当 isSelected = true 则增加selected class,
当isCar=true,则增加car class,
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询