Check this example. Now please take its reference and correct your code.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Index</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.js"></script>
<style type="text/css">
#dvItems table, thead, tbody
{
display: block;
}
#dvItems tbody
{
position: absolute;
height: 150px;
overflow-y: scroll;
}
#dvItems td, th
{
min-width: 100px !important;
height: 25px !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
max-width: 100px !important;
}
#dvItems .table-bordered {
border: 0px solid #ddd !important;
}
</style>
<script type="text/javascript">
var app = angular.module('MyApp', []);
app.controller('MyController', function ($scope) {
$scope.items = [{ Id: 0, Name: 'All' },
{ Id: 1, Name: 'aaa', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 2, Name: 'bbb', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 3, Name: 'ccc', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 4, Name: 'ddd', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 5, Name: 'eee', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 6, Name: 'fff', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 7, Name: 'ggg', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 8, Name: 'hhh', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn' },
{ Id: 9, Name: 'iii', Name1: 'aaaaaaaaaaaaaaaaaaaaaaaa', Gender: 'Male', Phoone: '373773737373', Name2: 'nnnnnnnnnnnnnnnnnnnnnnnn'}];
});
</script>
</head>
<body ng-app="MyApp" ng-controller="MyController">
<div class="container" id="dvItems">
<div class="container" style="position: fixed; height: 200px; overflow-x: scroll;
overflow-y: hidden">
<table class="table table-bordered table-condensed table-striped" style="height: 200px;">
<thead>
<tr class="success">
<th>Id</th>
<th>Item</th>
<th>Name1</th>
<th>Gender</th>
<th>name2</th>
<th>Id</th>
<th>Item</th>
<th>Name1</th>
<th>Gender</th>
<th>name2</th>
<th>Id</th>
<th>Item</th>
<th>Name1</th>
<th>Gender</th>
<th>name2</th>
<th>Id</th>
<th>Item</th>
<th>Name1</th>
<th>Gender</th>
<th>name2</th>
<th>Id</th>
<th>Item</th>
<th>Name1</th>
<th>Gender</th>
<th>name2</th>
<th>Id</th>
<th>Item</th>
<th>Name1</th>
<th>Gender</th>
<th>name2</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in items">
<td>{{item.Id}}</td>
<td>{{item.Name}}</td>
<td>{{item.Name1}}</td>
<td>{{item.Gender}}</td>
<td>{{item.Name2}}</td>
<td>{{item.Id}}</td>
<td>{{item.Name}}</td>
<td>{{item.Name1}}</td>
<td>{{item.Gender}}</td>
<td>{{item.Name2}}</td>
<td>{{item.Id}}</td>
<td>{{item.Name}}</td>
<td>{{item.Name1}}</td>
<td>{{item.Gender}}</td>
<td>{{item.Name2}}</td>
<td>{{item.Id}}</td>
<td>{{item.Name}}</td>
<td>{{item.Name1}}</td>
<td>{{item.Gender}}</td>
<td>{{item.Name2}}</td>
<td>{{item.Id}}</td>
<td>{{item.Name}}</td>
<td>{{item.Name1}}</td>
<td>{{item.Gender}}</td>
<td>{{item.Name2}}</td>
<td>{{item.Id}}</td>
<td>{{item.Name}}</td>
<td>{{item.Name1}}</td>
<td>{{item.Gender}}</td>
<td>{{item.Name2}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
