AngularJS中ng-class使用方法

 三种方法：
1. 通过$scope 绑定（不推荐）；
    function ctrl($scope){
        $scope.className = "selected";
    }

    <div class="{{className}}"></div>


2. 通过对象数组绑定；
    function ctrl($scope){
        $scope.isSelected = true;
    }
    <div ng-class="{true:'selected',false:'unselected'}[isSelected]"></div>

   // 当 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 样式；

<ion-list>
    <ion-item ng-repeat = "project in projects" ng-click = "selectProgect(project,$index)" ng-class="{active:activeProject == project}">
        {{project.title}}
    </ion-item>
</ion-list>

//根据 projects 创建 ico-item, 当activeProject为当前循环到的project 时，增加active样式；



说明：
1. 不推荐 第一种方法，因为controller,$scope 应该只有数据和行为；
2. ng-class是增加相关样式，可以和class同时使用；

转载于:https://www.cnblogs.com/nnf-888/p/8432497.html