<!doctype html>
<html ng-app>
<head><title>Angularjs Alternate Rows of Table : devzone.co.in</title>
<script src="http://code.angularjs.org/1.2.9/angular.min.js"></script>
<style>
.odd {
background-color: #FFF;
}
.even {
background-color: #ccc;
}
table{
border: 1px solid #ccc;
}
.main{
margin: 10px auto;
width:350px;
border: 1px solid #ccc;
padding: 20px;
}
</style>
</head>
<body>
<div class='main'>
<table ng-init="names = ['Delhi', 'Mumbai', 'Pune', 'Gwalior', 'Jaipur', 'Bhopal', 'Indore', 'Chennai']" >
<tr ng-repeat="name in names" ng-class-odd="'odd'" ng-class-even="'even'">
<td>{{name}}</td>
</tr>
</table>
<a href='http://devzone.co.in' target='_blank'>DevZone.co.in</a>
</div>
</body>
</html>
<html ng-app>
<head><title>Angularjs Alternate Rows of Table : devzone.co.in</title>
<script src="http://code.angularjs.org/1.2.9/angular.min.js"></script>
<style>
.odd {
background-color: #FFF;
}
.even {
background-color: #ccc;
}
table{
border: 1px solid #ccc;
}
.main{
margin: 10px auto;
width:350px;
border: 1px solid #ccc;
padding: 20px;
}
</style>
</head>
<body>
<div class='main'>
<table ng-init="names = ['Delhi', 'Mumbai', 'Pune', 'Gwalior', 'Jaipur', 'Bhopal', 'Indore', 'Chennai']" >
<tr ng-repeat="name in names" ng-class-odd="'odd'" ng-class-even="'even'">
<td>{{name}}</td>
</tr>
</table>
<a href='http://devzone.co.in' target='_blank'>DevZone.co.in</a>
</div>
</body>
</html>
No comments:
Post a Comment