ng-class是一个判断是否给某一个元素添加类名的属性:
例如:下面是判断 是否添加 aHover 这个类名:
<ul class="nav fl w120 o"> <li><a ng-click="homeClick()" ng-class="{true:'aHover',false:''}[homeHover]">首页</a></li> <li><a ng-click="selectedClick()" ng-class="{aHover: selectedHover == true}">精选</a></li> <li><a ng-click="channelClick()" ng-class="{aHover: channelHover}">频道</a></li> <li><a ng-click="collectClick()" ng-class="{aHover: collectHover}">我的收藏</a></li> </ul>
具体JS:
myApp.controller('myAppController',['$scope',function($scope){ $scope.homeHover = true; $scope.selectedHover = false; $scope.channelHover = false; $scope.collectHover = false; $scope.homeClick = function(){ $scope.homeHover = true; $scope.selectedHover = false; $scope.channelHover = false; $scope.collectHover = false; }; $scope.selectedClick = function(){ $scope.homeHover = false; $scope.selectedHover = true; $scope.channelHover = false; $scope.collectHover = false; }; $scope.channelClick = function(){ $scope.homeHover = false; $scope.selectedHover = false; $scope.channelHover = true; $scope.collectHover = false; }; $scope.collectClick = function(){ $scope.homeHover = false; $scope.selectedHover = false; $scope.channelHover = false; $scope.collectHover = true; }; }]);