AngularJS中ng-class使用方法

Posted ぃ尐懒貓ヤ

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了AngularJS中ng-class使用方法相关的知识,希望对你有一定的参考价值。

有三种方法: 1、通过$scope绑定(不推荐) 2、通过对象数组绑定 3、通过key/value键值对绑定 实现方法: 1、通过$scope绑定(不推荐): function ctrl($scope) { $scope.className = "selected"; }
2、通过对象数组绑定: function ctrl($scope) { $scope.isSelected = true; }
当isSelected为true时,增加selected样式;当isSelected为false时,增加unselected样式。 3、通过key/value键值对绑定: function ctrl($scope) { $scope.isA = true; $scope.isB = false; $scope.isC = false; }
当isA为true时,增加A样式;当isB为true时,增加B样式;当isC为true时,增加C样式。 根据projects循环创建ion-item,当activeProject为当前循环到的project时,增加active样式。 几点说明: 1、不推荐第一种方法,因为controller $scope应该只有数据和行为 2、ng-class是增加相关样式,可以和class同时使用

以上是关于AngularJS中ng-class使用方法的主要内容,如果未能解决你的问题,请参考以下文章

AngularJS中ng-class使用方法

使用 ng-class 的 AngularJS 切换类

AngularJS之ng-class

如何基于另一个元素的类使用 AngularJS ng-Class 条件?

如何在angularjs中动态地将样式属性添加到具有ng-class的元素

angularjs中ng-class的多个条件