Can I customize my AngularJS application to display local times?

Question

I am using an ASP.NET MVC / ASP.NET Web API back-end for my application. When a user updates data the time is recorded like this:

    public HttpResponseMessage PutContent(int id, Content content)
    {
        if (id != content.ContentId)
        {
            return Request.CreateResponse(HttpStatusCode.BadRequest);
        }
        try
        {
            content.ModifiedDate = DateTime.Now;
            content.ModifiedBy = User.Identity.GetUserId();
            _uow.Contents.Update(content);
            _uow.Commit();
            return Request.CreateResponse(HttpStatusCode.OK, content);
        }
        catch (Exception ex)
        {
            return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex);
        } 
    }

When the user looks at the modified time they see what I assume is the server time. Is there a way that I can allow them to see the local time that the change was made?

Note that already I do some formatting but I am not sure if there is a way that I can convert the date and have this matched up with my local users who could be in any location:

<input disabled="disabled" type="text" 
   value="{{modal.data.modifiedDate | date:'MM/dd/yy HH:mm'}}" />

Answer 1

To start with it is always better to save the dates on server in UTC. So on the server use the method DateTime.UtcNow.

And while sending the data to client, if you are not custom formatting the date, i believe the date send contains the timezone information as well. AngularJS can handle that correct using date filter. See this fiddle http://jsfiddle.net/jHSLe/1/

Answer 2

Assuming the date you are getting is in UTC, you can use the excellent Moment.js to easily convert it to local time as described here:

http://momentjs.com/docs/#/manipulating/local/