Hi mahesh213,
Apply CSS property to the last row.
Check this example. Now please take its reference and correct your code.
Controller
public class HomeController : Controller
{
// GET: /Home/
public ActionResult Index()
{
return View();
}
public JsonResult GetEmployees()
{
List<object> employees = new List<object>();
employees.Add(new { Id = 1, Name = "John Hammond", Country = "United States" });
employees.Add(new { Id = 2, Name = "Mudassar Khan", Country = "India" });
employees.Add(new { Id = 3, Name = "Suzanne Mathews", Country = "Russia" });
employees.Add(new { Id = 4, Name = "Robert Schidner", Country = "France" });
return Json(employees, JsonRequestBehavior.AllowGet);
}
}
View
<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>
<script type="text/javascript">
var app = angular.module("MyApp", []);
app.controller("MyController", ['$scope', '$http', function ($scope, $http) {
$http.get("/Home/GetEmployees")
.then(function (response) {
for (var i = 0; i < response.data.length; i++) {
if (i == response.data.length - 1) {
$scope.LastRecord = response.data[i];
}
}
$scope.Employees = response.data;
});
} ]);
</script>
<div ng-app="MyApp" ng-controller="MyController">
<table id="tblCustomers" class="table table-responsive">
<thead>
<tr>
<th ng-repeat="(header, value) in Employees[0]">
{{header}}
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="row in Employees">
<td ng-repeat="cell in row" ng-style="row == LastRecord &&{'font-weight': 'bold'}">
<span>{{cell}}</span>
</td>
</tr>
</tbody>
</table>
</div>
Screenshot
Id | Name | Country |
1 |
John Hammond |
United States |
2 |
Mudassar Khan |
India |
3 |
Suzanne Mathews |
Russia |
4 |
Robert Schidner |
France |