Changing Time to Extended Form in AngularJS

Currently, I have an input box that is displaying the time in the format HH:mm AM/PM.

<input type="text" ng-model="myTime" required/>

To achieve this, I am utilizing the date filter in AngularJS -

$scope.myTime = $filter("date")(new Date(), 'shortTime');

Now, I need to send this time to another layer in a longer format. Is there a way to accomplish this within AngularJS without relying on Moment.js?

Note: It would be preferable to find a solution that does not involve using Moment.js.

Answer №1

Imagine having a string that contains "HH:mm" (meaning hours range from 0-23, so ap/pm is unnecessary). To convert this time to a long format with your local date, follow these steps:

// Split the time string
var time = "18:45".split(":");

// Create a new Date object
var now = new Date();

// Set the hours and minutes
now.setHours(time[0]);
now.setMinutes(time[1]);

// Get the timestamp for the long version
now.getTime();

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

The canvas loop list is not displaying for the oscillating image effect

My concept originated when I attempted to create a wave effect using an array of images, but unfortunately, it did not work as expected. The goal was to generate multiple waves in the images by utilizing an array, however, the desired outcome was not achie ...

Duplicated Highstock Navigator on Screen

I encountered an issue while using Highstock 5.0.10 with angularJS. The navigator in my chart is getting displayed twice, as shown in the image below: https://i.sstatic.net/pIvnL.png Strangely, if I refresh the page, everything looks fine. Any suggestion ...

Connected Date Selector

I am new to using Bootstrap and attempting to implement a linked datepicker with the following requirements: Display only the date (not the time). The default selected date on page load should be today's date for both the Datepicker and the text ...

The Angular2 client is receiving a response from the Node API through Express, but the format is incorrect

My Angular2 component is making a request to retrieve my fake model data object, but the returned response looks like this: _body: "[↵ {↵ "id": 0,↵ "title": "2017 Oscars",↵ "graphic": "https://wikitags.com/images/OscarsBanner.png",↵ https://i.s ...

I am looking for an alternative approach to retrieve the data from the controller in case of success instead of the method provided in the code below

In this code snippet, I am looking for an alternative way to retrieve data from the controller upon successful execution, rather than checking it as data.msg. I want to avoid using strings or boolean values like SuccessWithPass. Controller snippet: if ...

What is the reason behind the ability to omit the arrow function and method argument in RxJS subscribe?

Recently, I found myself in a situation where I had to work with RxJS. While trying to set up an error handling flow, I came across some unusual syntax for passing method arguments: .subscribe( x => { }, console.warn // <- I was puzzled b ...

The characteristics of a const anonymous function in JavaScript

I keep encountering an issue when attempting to determine the length of an anonymous array. I am uncertain if this operation is permitted or not. const gamearena = function () { var matrix = []; var height = 20; var width = 10; while(heig ...

Managing HTTP Requests on a Website Using HTTPS

On my html page, I have references to Java script files hosted by Google using Http. However, since my site is Https, the page loads with a message saying "Only secured content is displayed." I need to change these calls to use Https instead of http. I at ...

Numbering the items in ng-repeat directive

I am facing a challenge with my AngularJS directive that is recursively nested within itself multiple times. The issue lies in the fact that the names of items in ng-repeat conflict with those in the outer element, causing it to malfunction. To illustrate ...

Setting up custom permissions for users in a Discord bot using Discord.js

Currently, I am trying to configure specific commands for myself and my friend who are the bot owners. Initially, I set up commands exclusively for MYSELF with this code: var owner = ("487218875138572298") if (msg.startsWith (prefix + " ...

Ending JavaScript promises

I am currently utilizing the Google JS closure library which can be found at https://developers.google.com/closure/library/ Below is the code snippet that I have: if (endDate >= wap.com.ifx.util.IfxComponentUtil.yyyymmdd(currentDate) && goog.o ...

AngularJS scope failing to refresh

When performing get or put operations in IndexedDB, the callback is updating the scope, but unfortunately no UI updates are being triggered. It's often suggested to use apply or digest to solve this issue, but that approach is incorrect. Angular shou ...

What is the best way to create a large-scale matrix using SVG technology?

I want to create a 10000X10000 matrix in canvas/svg, with each cell containing a square. I attempted to accomplish this using canvas and two loops: for(i=0; i<10000; i++){ for(j=0;j<10000; j++){ /*some drawing code*/ console.log(i,' ...

Unable to establish connection with Uploadthing due to a timeout error

I am facing timeout errors while setting up the upload feature. app/api/uploadthing/core.ts import { createUploadthing, type FileRouter } from "uploadthing/next"; import { auth } from "@clerk/nextjs"; const handleAuth = () => { c ...

Steps for designing beautiful AngularJS layout templates

I'm currently developing a web application using node.js and utilizing Yeoman angular scaffolding for the client side. Within my index.html file, I have all the necessary javascript files included for loading. My objective is to create a header file ...

Interactive Canvas Feature: Drag and Drop Across Various Objects in HTML 5

I have developed a custom code that enables the creation and rendering of objects on an HTML5 canvas. class Rectangle extends Shape { constructor(options, canvas, type = 'rectangle') { super(...); // inherited from the super class thi ...

Is it justifiable to stop providing support for javascript-disabled or non-ajax browsers in secure applications?

I'm intrigued by the current trend in ajax applications. Is it acceptable to focus on building the best ajax application possible and disregard browsers that don't support ajax (especially if it's a secured part of the site and not public)? ...

Is it possible to create a "private" variable by utilizing prototype in JavaScript?

In my JavaScript code, I am trying to have a unique private variable for each "instance," but it seems that both instances end up using the same private variable. func = function(myName) { this.name = myName secret = myName func.prototype.tel ...

The update operation in MongoDB fails as it requires the _id to be in the form of an ObjectId instead of a

I am currently working on a REST API to facilitate data exchange between a MongoDB database and a web application. The data being exchanged is in JSON format. One issue I am encountering pertains to updating a document: Error: cannot change _id of a docu ...

The event handler is malfunctioning in Django's inline formset

I have created an inline formset with the following structure: class EventForm(ModelForm): class Meta: model = Event exclude = ['created'] class GalleryForm(ModelForm): class Meta: model= Gallery exclude ...