current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Dismiss
Announcing Stack Overflow Documentation

We started with Q&A. Technical documentation is next, and we need your help.

Whether you're a beginner or an experienced developer, you can contribute.

Sign up and start helping → Learn more about Documentation →
up vote 7 down vote favorite
1

I've got a REST API that returns JSON data with dates in a standard ISO-8601 format: yyyy-MM-ddTHH:mm:ss:

{
    id: 4
    version: 3
    code: "ADSFASDF"
    definition: "asdflkj"
    type: "CONTAINER"
    value: "1234"
    active: "false"
    formula: false
    validTo: "2014-12-31T05:00:00"
    validFrom: "2010-12-31T10:00:00"
}

My issue is that I'm not quite sure how to deal with this in AngularJS. I have a $resource which GETs, POSTs, etc my API endpoints, but when my data is returned, it is stored in my JS object as as String. I figure that it would be easier to handle as a Date() or a Moment().

In Java, I can use a JsonDeserializer to ensure that all JSON data is properly converted prior to being assigned to the model, but I don't know if there is a similar mechanism in AngularJS.

I've searched around, but can't seem to find anything that implements a generalized solution. I realize that I can use a transformResponse function in my $resource, but that seems like a lot of repeated configuration for every data type that may contain a date.

This leads me to wonder if returning the date in an ISO-8601 format is the best way to proceed? If AngularJS doesn't support it out of the box, I presume that there must be an easier way to deal with dates. How does one deal with dates in AngularJS? Should I just be treating them as text/string objects, and have the API return a pre-formatted version? If so, what is the most flexible format to use in an HTML5 date input box, etc?

share|improve this question
    
Use moment js to format your date on client momentjs.com/docs. Usually the date that you return from server treat as string which it reaches on client. You have to format it by yourself using custom js code or library like moment. Also, I don't think you need to do this in app.config. Just get your data from the server and format the date prop, or you can use Angular filters to format date docs.angularjs.org/api/ng/filter/date. – Ammar Khan Aug 21 '14 at 1:56
up vote 8 down vote

JSON does not support dates so you will need to send out dates as strings or integers, and convert them to Date objects when suitable. Angular does not do that for you, but you can define a default transformResponse function to $httpProvider. I tried that with $resource and it does affect to it as well, after all, $resource is a higher level abstraction for $http.

If you don't know the structure of your JSON or don't want to rely on it in the conversion function you just need to go it through and convert date-like strings to Date objects.

var convertDates = function(input) {
  for(var key in input) {
    if (!input.hasOwnProperty(key)) continue;

    if (typeof input[key] === "object") {
      convertDates(input[key]);
    } else {
      if (typeof input[key] === "string" && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}$/.test(input[key])) {
        input[key] = new Date(input[key]);
      }
    }
  }
}

app.config(["$httpProvider", function ($httpProvider) {
   $httpProvider.defaults.transformResponse.push(function(responseData){
     convertDates(responseData);
     return responseData;
  });
}]);

Depending on your app this may be unwise from performance perspective (e.g. only a handful of JSON responses contain dates or actually need the dates to be converted) so it might be best to convert the dates in those controllers where that is actually needed.

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.