<html>
<script
src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
</script>
<!--
ng-repeat- it used to repeat a set of html code for a number of times-->
<style>
body {
margin: 2%;
font-size: 120%;
background-color:pink;
}
</style>
<body
ng-app="myApp" ng-controller="ListController">
<h1 align='center'>Student
Details</h1>
<table border=1 align='center'>
<thead>
<tr>
<th>S.No</th>
<th>Name</th>
<th>City</th>
<th>Mobile
No.</th>
</tr>
</thead>
<tr ng-repeat="item
in itemsDetails">
<td>
{{item.sno}} </td>
<td>
{{item.name}} </td>
<td>
{{item.city}} </td>
<td>
{{item.mobileno}} </td>
</tr>
</table>
</body>
<script>
var app = angular.module('myApp', []);
app.controller(
'ListController', function($scope) {
$scope.itemsDetails = [
{
sno: 1,
name:
'Adhira',
city:
'Pune',
mobileno:
9978657865,
},
{
sno: 2,
name:
'Abira',
city:
'Mumbai',
mobileno:
7678908765,
},
{
sno: 3,
name:
'Akira',
city:
'Satara',
mobileno:
8976567897,
},
{
sno: 4,
name:
'Amira',
city:
'Pune',
mobileno:
7678976545,
}
];
});
</script>
</HTML>