Convert JSON Date to Date format using JavaScript and AngularJS in ASP.Net MVC

Last Reply one year ago By dharmendr

Posted one year ago


based upon below url i have generate a grid view dynamically

Display record on HTML Table based upon dynamic control values using AngularJS in ASP.Net MVC

relevant values are displaying properly in grid view

coming to my requirement is

if you can look at into screenshot here date is dispalying in string format

i need to dispaly date value instead of string

Could you please check it and help me

        <th ng-repeat="(header, value) in employees[0]">
    <tr ng-repeat="row in employees">
        <td ng-repeat="cell in row">
            {{cell  @*| dateFilter | date:"dd-MM-yyyy"*@}}


Posted one year ago Modified on one year ago

Hi mahesh213,

Since you are dynamically populate columns and rows it is nopt possible to use filter.

So to display the Date properly you need to convert it to Date before assigning to scope.

Check this example. Now please take its reference and correct your code.


For this example I have used of Northwind database that you can download using the link given below.

Download Northwind Database


public class HomeController : Controller
    // GET: /Home/
    public ActionResult Index()
        return View();

    public JsonResult GetEmployees()
        NorthwindEntities entities = new NorthwindEntities();
        var employees = entities.Employees
            .Select(x => new
                Id = x.EmployeeID,
                Name = x.FirstName + " " + x.LastName,
                DOB = x.BirthDate,
                City = x.City,
                Country = x.Country
        return Json(employees, JsonRequestBehavior.AllowGet);


    <link rel="stylesheet" href="" />
    <script type="text/javascript" src=""></script>
    <script type="text/javascript">
        var app = angular.module("MyApp", []);
        app.controller("MyController", ['$scope', '$http', function ($scope, $http) {
            .then(function (response) {
                for (var i = 0; i <; i++) {
                    // Loop through each property in the Array.
                    for (var property in[i]) {
                        if ([i].hasOwnProperty(property)) {
                            var resx = /Date\(([^)]+)\)/;
                            // Checking Date with regular expresion.
                            if (resx.test([i][property])) {
                                // Setting Date in dd/MM/yyyy format.
                      [i][property] = ConvertJsonDateToDate([i][property]);
                $scope.Employees =;
            function ConvertJsonDateToDate(date) {
                var parsedDate = new Date(parseInt(date.substr(6)));
                var newDate = new Date(parsedDate);
                var month = ('0' + (newDate.getMonth() + 1)).slice(-2);
                var day = ('0' + newDate.getDate()).slice(-2);
                var year = newDate.getFullYear();
                return day + "/" + month + "/" + year;
        } ]);
    <div ng-app="MyApp" ng-controller="MyController">
        <table class="table table-responsive">
                    <th ng-repeat="(header, value) in Employees[0]">{{header}}</th>
                <tr ng-repeat="row in Employees">
                    <td ng-repeat="cell in row">{{cell}}</td>