描叙:使用ng-class实现每隔3行换色
代码:
<!DOCTYPE html> <html ng-app="myApp"> <head> <meta charset="UTF-8"> <title>隔行换色</title> <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> <style> ul{ list-style: none; } li{ height:24px; line-height: 24px; background:red; } .special-color{ background:#fff; } </style> <script type="text/javascript"> var app = angular.module('myApp', []); app.controller('CourseCtrl', function ($scope, $http) { $scope.items = [0,1,2,3,4,5,6,7,8,9,10]; $scope.changeColor = function(index){ var bFlag = null; (parseInt(index/3))%2 == 0 ? bFlag =true : bFlag = false; return bFlag; } }); </script> </head> <body ng-controller="CourseCtrl"> <ul class="container "> <li ng-repeat="item in items" ng-class="{'special-color':changeColor($index)}">{{item}}</li> </ul> </body> </html>
作者:smile.轉角
QQ:493177502