Incorrect handling of Unix timestamps in AngularJS

I'm facing an issue with timestamps. Let me explain - I have a timestamp coded as 1378028575, which corresponds to Sun, 01 Sep 2013 09:42:55 GMT according to this website. The problem arises when I attempt to format this timestamp using Angular's date function. Instead of displaying the expected date and time, it returns Jan 17, 1970 2:47:08 AM when using this format: {{'1378028575' | date:'medium'}}. It seems like there is a discrepancy between the actual timestamp value and how Angular interprets it. Any insights on why this might be happening or what I could be doing incorrectly?

Answer №1

It's because you are using seconds instead of milliseconds.

new Date(1378028575)
Fri Jan 16 1970 23:47:08 GMT+0100 (CET)

new Date(1378028575000)
Sun Sep 01 2013 11:42:55 GMT+0200 (CEST)

This information is highlighted in the Angular documentation:

The date should be formatted either as a Date object, milliseconds (string or number), or various ISO 8601 datetime string formats (e.g. yyyy-MM-ddTHH:mm:ss.SSSZ and its shortened versions like yyyy-MM-ddTHH:mmZ, yyyy-MM-dd, or yyyyMMddTHHmmssZ). If no timezone is specified in the string input, the time will default to the local timezone.

Answer №2

The previous response was helpful, but there are some additional details to consider. If your timestamp is in seconds (not milliseconds) and you're working with Angular.js, you can utilize the following code snippet:

{{1378028575 * 1000 | date:'medium'}}

Understanding that converting seconds to milliseconds involves multiplying by 1000 is important. It's also worth noting that mathematical operations can be incorporated within date expressions in Angular.js.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Issue encountered while attempting to host an ejs file using Express in Node.js

I'm encountering an issue while attempting to serve an .ejs file using express. The error I'm getting is as follows: Error: No default engine was specified and no extension was provided. at new View (C:\development\dashboard& ...

difficulty with parsing JSON in jQuery when referencing an external file containing the same data

Looking for help with parsing a json file using jquery? Check out this working sample: http://jsfiddle.net/bw85zeea/ I'm encountering an issue when trying to load "data2" from an external file. The browser keeps complaining that it's an invalid ...

Issue with autoplay slideshow functionality not activating when opened in a new tab

The owl.carousel.js plugin is used for creating a jQuery slideshow. Initially, the slideshow works correctly, but I noticed that the autoplay feature stops working when I open a new tab in Firefox or Chrome. Demo : Demo : $(document).ready(function () ...

Having trouble with the installation of nodemon globally on macOS Mojave?

When using the Visual Studio Code terminal, I ran the following command: npm install -g nodemon The output in the terminal showed: npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules npm ERR! code EACCES npm ERR! syscall access n ...

Develop a fresh class by inheriting from HTMLDivElement and expanding its prototype

My goal is to add a new method to the HTMLDivElement prototype without cluttering the HTMLDivElement itself with my custom methods. This has led me to attempt creating a new class that extends the HTMLDivElement. export class ScrollableElement extends HTML ...

Extract data from an ajax request in an AngularJS directive and send it to the controller

I am currently experimenting with integrating the jQuery fancy tree plugin with Angular. The source data for the tree is fetched through an ajax call within my controller. I am facing a challenge in passing this data to my directive in order to load the tr ...

The scrollbar on the side of my page seems to be malfunctioning

I'm having an issue with the collapsible sidebar and tabs on my angularjs page. The scroll bar is not appearing when there is overflow in the sidebar. I've tried setting the scrollbar height to auto and overflow-y to scroll, but it's not wor ...

The conditional statement for ajax is malfunctioning

I am encountering an issue with some ajax coding. The if condition is not working as expected - whenever the program runs, only the else statement gets executed even when the if statement should be satisfied. <script type="text/javascript> funct ...

convert and transform XML data into JSON format

I have been working with nodejs-expressjs and I received a response in raw XML format. My goal is to convert this raw XML into either a JavaScript array or a JSON array so that I can extract the domain name along with its status. I want to display this inf ...

Struggling with sending intricate model to controller via ajax request

I've encountered an issue where my model is not updating properly when I click a button. Despite logging the data in the razor file and confirming that it's correct, the controller method receives an empty model. Below is the onclick method bein ...

AngularJS nested directive with isolated scope for a straightforward implementation

Please take a look at this plunker Despite reading extensively on directives, scopes, and isolated scopes, I am still struggling to comprehend how to make it all work together. The directive I've created functions perfectly on its own, but encounter ...

Specify the location of the resize button (corner)

Scenario : At the bottom of the page, there is a resizable textarea, However, having the resize button at the bottom-right corner does not provide the best user experience (try it out), Issue : I am wondering if there is a way to move the resize butt ...

issue with selecting tabs in jquery

I need help with a problem that is connected to my previous article on CSS, button selection, and HTML tags. You can find the article here. I am not very proficient in JavaScript, so I would appreciate any insights or guidance on how to tackle this issue. ...

Error encountered in Three.js: ShaderPass.js is unable to read the property 'prototype' of undefined

I'm currently facing an issue while trying to implement a basic GlitchPass in a Three.js demo. I keep encountering the error message Uncaught TypeError: Cannot read property 'prototype' of undefined at ShaderPass.js. For this particular dem ...

Form duplicates messages sent

I have made some adjustments to a free form, and it seems to be functioning properly. However, I have encountered an issue where the email is being sent twice and the message is written twice after completion. I attempted to replace the button and input ...

Can anyone explain the meaning of (0, _jquery["default"]) in relation to jQuery selectors or functions?

Trying to implement jQuery on an offline page can be challenging when dealing with EmberJS, RequireJS, and other technologies. My goal is to replace complex code with simple jQuery. The HTML below should respond to user interaction: Loading i ...

How can we ensure that a child directive in AngularJS shares the same data as its parent?

My child directive needs access to the same data as its parent pages. What would be the most effective method for sharing this data? Should the child directive fetch the data separately, or should the parent send it through attributes? ...

Analyzing the DOM content loading time for web pages generated using AJAX technology

When analyzing website performance, I rely on window.performance.timing. However, this method falls short when it comes to measuring the performance of webpages loaded through ajax calls. For instance, websites built with frameworks like angularjs often lo ...

Enhancing the efficiency of nested ajax calls loop

Disclaimer: While the final result is successful, I am struggling to comprehend the sequence in which a loop of nested ajax calls operates. Essentially, I have two ajax calls that fetch data from an external API using curl GET requests. They both rely on ...

Show the chosen item from a dropdown menu using Bootstrap

Here is the HTML code that I am working with: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="h ...