current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I am working on an application that is written in ASP.NET WebAPI and Angular. Everything is working great except for the JSON dates that I'm getting from WebAPI which look like /Date(1402034400000)/. Angular doesn't know what to do with this string. If I parse it down to just the numbers then it converts it to a date when I use date: 'MM/dd/yyyy'.

How do I go about fixing this in the angular way? Maybe a directive?

In this view the person.trainingDate looks like /Date(1402034400000)/ in the rendered HTML. Even if I add | date: 'MM/dd/yyyy' it displays the same because angular doesn't recognize the string as a parsable date.

<table class="table table-bordered table-hover">
    <thead><tr><th>Training Date</th></tr></thead>
    <tbody>
        <tr ng-repeat="person in company.people">
            <td>{{person.trainingDate}}</td>
        </tr>
    </tbody>
</table>

Thank you,

Aaron

share|improve this question

2 Answers 2

up vote 0 down vote accepted

If the value returned by your WebApi is a actually date and not date converted to string the returned value will be something like "2012-03-19T07:22Z" which is actually the ISO 8601 standard.

It is up to the browser to understand this value as date which most browsers understand except for IE8 or earlier (as far as I am aware) but in order to guarantee that this value is parsed as a date your can use other JS libraries like moment.js .

share|improve this answer
up vote 0 down vote

To solved that you can create custom filter please see http://jsbin.com/gaqoce/1/edit

var app = angular.module('app', []);

app.filter('customDate', function(){
  return function(value) {
  var myDate = new Date(value.match(/\d+/)[0] * 1);  
  return  myDate;
  };

});
app.controller('firstCtrl', function($scope){

  $scope.person= {
    trainingDate: '/Date(1402034400000)/'
  };
});

html:

 <div ng-controller="firstCtrl">
  <p>{{person.trainingDate | customDate }}
</p>
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.