0

I have ASP.NET MVC project and I am trying to format date (dd/MM/yyyy) in my cshtml UI but its returning null.

Below is my cshtml code:

    <tr ng-repeat="item in items">
                        <td>{{item.Id}}</td>
                        <td>{{item.Name}}</td>
                        <td>{{item.Manufacturer}}</td>
                        <td>{{item.BatchNo}}</td>
                        <td width="50px">{{item.ExpiryDate| date: 'dd/MM/yyyy'}}</td>
    </tr>

I tried two ways:

1) formatting in .NET cshtml itself but nothings happening:

<td width="50px">{{item.ExpiryDate| date: 'dd/MM/yyyy'}}</td>

2) I tried using filter but its returning null:

medApp.filter('cmdate', [
    '$filter', function ($filter) {
        return function (input) {
            return $filter('date')(new Date(input), 'dd/MM/yyyy');
        };
    }
]);

code in cshtml:

<td width="50px">{{item.ExpiryDate| cmdate: 'dd/MM/yyyy'}}</td>

Any clue about the issue?

Thanks

Anil Jain
  • 85
  • 2
  • 14
  • 2
    show the `item.ExpiryDate` value – Sachila Ranawaka Dec 06 '17 at 10:47
  • Is `ExpiryDate` a date **object**? – Liam Dec 06 '17 at 10:48
  • @SachilaRanawaka ... Its null when I use the custom filter. If I use {{item.ExpiryDate| date:'dd/MM/yyyy'}} then its /Date(1513881000000)/ I am getting the values from SQL Server and its coming fine. – Anil Jain Dec 06 '17 at 10:51
  • @Liam ...Its a field in product object. – Anil Jain Dec 06 '17 at 10:52
  • Yes, obviously... your other comment says it is a date object – Liam Dec 06 '17 at 10:53
  • 3
    From your comments, you have [this issue](https://stackoverflow.com/questions/726334/asp-net-mvc-jsonresult-date-format) –  Dec 06 '17 at 10:57
  • Open the Network tab of the browser to see what are the values returned from the server. – mihkov Dec 06 '17 at 11:04
  • @mihkov In the network tab it shows the same date format /Date(1513881000000)/ but in .NET controller the format is as retrieved from db. – Anil Jain Dec 06 '17 at 12:32
  • @RameshRajendran I am looking into the url you specified. Thanks. – Anil Jain Dec 06 '17 at 12:34
  • Guys, this worked for me https://stackoverflow.com/questions/29957878/convert-c-sharp-datetime-to-angular-date The solution by @Vijaykumar vp ... but is it the right thing to do? – Anil Jain Dec 06 '17 at 12:41
  • I suggest you to use the solution provided from @StephenMuecke . Else you can modify the models returned from the controller. For example: adding an additional property where the date is better formatted – mihkov Dec 06 '17 at 13:16
  • Going ahead with the link and answered by Nitish Kumar https://stackoverflow.com/questions/22392328/how-to-format-date-in-angularjs This one is similar to what @mihkov suggested. – Anil Jain Dec 06 '17 at 18:06

1 Answers1

0

your date passing as json format. create the custom filter like this.

app.filter("cmdate", function() {
    var re = /\/Date\(([0-9]*)\)\//;
    return function(x) {
        var m = x.match(re);
        if( m ) return new Date(parseInt(m[1]));
        else return null;
    };
});

Now call it like this

<td width="50px">{{item.ExpiryDate| cmdate | date: 'dd/MM/yyyy'}}</td>
Sachila Ranawaka
  • 39,756
  • 7
  • 56
  • 80