Establish the date input format specifically for vue-moment

I've been trying to use vue-moment for date formatting in my application, but I'm having trouble getting it to recognize the input format that moment.js should parse. The date format returned by my API is like this:

2019-01-01 24:00:00 GMT

Here's how I am setting the (input) format and outputting it using a v-for:

{{ [ date, "YYYY-MM-DD HH:mm:ss z" ] | moment("subtract", "5 hours", "YYYY-MM-DD hh:mm:ss A") }}

However, I keep encountering this error message:

Could not build a valid `moment` object from input.

Answer №1

It appears that the timezone z is causing confusion for moment js, therefore I decided to exclude it by utilizing [ ] in this manner:

{{ [ date, "YYYY-MM-DD HH:mm:ss [GMT]" ] | moment("subtract", "5 hours", "YYYY-MM-DD hh:mm:ss A") }}

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

What is the best method for transferring states between components?

When it comes to React JS, I am a beginner looking to develop a ToDo list application. In my project, I have the main page App.js, where I created the component MainBlock. This MainBlock component structures the layout into left and right sides. On the rig ...

The attempt to generate a .zip file using Node.js with Egg framework was unsuccessful

I developed a Node.js service using Egg framework to send a local .zip file (compressed directory) to the browser, but encountered an issue. Below is the code snippet: Egg.js // Code for zipping files async download() { const ctx = this.ctx; co ...

Unable to submit form in Node.js with Express

I am just starting out with node.js and I need help with a sample form to insert values into a database. Below is the code snippet for my test page: <form action="/create" method="POST" class="form-horizontal" enctype="application/x-www-form-urlencode ...

The compiler detected an unanticipated keyword or identifier at line 1434. The function implementation is either absent or not placed directly after the declaration at line 239

Having trouble implementing keyboard functionality into my snake game project using typescript. The code is throwing errors on lines 42 and 43, specifically: When hovering over the "window" keyword, the error reads: Parsing error: ';' expecte ...

When properties are passed and then mapped, they become undefined

While I experience no errors when directly mapping the array, passing the same array through props results in an error stating "Cannot read property 'map' of undefined." Brands Array const brands = [ { key: 1, Name: "Nike", }, { ...

Exploring tailored markup features in Next.js version 13

I am trying to optimize my website for social media sharing on platforms like WhatsApp. I have been experimenting with different methods to set custom markup in Next.js 13, but haven't achieved the desired outcome yet. Your help and insight are greatl ...

What is the best way to handle responses in axios when dealing with APIs that stream data using Server-Sent Events (S

Environment: web browser, javascript. I am looking to utilize the post method to interact with a Server-Send Events (SSE) API such as: curl https://api.openai.com/v1/completions \ -H "Content-Type: application/json" \ -H ...

Error: 'require' is not recognized in index.html file for electron-forge application using the react template

After initiating an electron-forge app using the react template, I encountered an issue where the app only displayed a white screen. The developer console showed the error "Uncaught ReferenceError: require is not defined" at index.html:inline_0.js:2 electr ...

"Applying CSS styles to highlighted text using jQuery - how can I do it

Struggling to style selected text with CSS? Here's what I've tried so far without success in Firefox. $(document).keyup(function(){ savedRange = selection.getRangeAt(0); $(savedRange).wrap('<span style="color:red"></span>' ...

A useful tip for adding a blank line in a specific index of an array is to utilize the character while iterating through the array with a v-for loop to generate a list

I am trying to find a way to add an empty line before a specific array element while iterating through it using v-for to generate a list. Using \n does not seem to be effective for this task. <!-- Here is the template section --> <ul> ...

Angular version 11 fails to locate the lazy module

Here's a link to an application that is attempting to lazily load the BookModule using the following setup: const routes: Routes = [ { path: "", redirectTo: "/books", pathMatch: "full" }, { path: "books" ...

Using Vuetify to create subtle fade in animation when scrolling

I'm attempting to create a fade-in effect while scrolling through the page for the first time. Even though I used <v-scroll-x-transition appear>, the desired effect doesn't seem to be working. Instead of fading in from the right as expecte ...

Discover the magic of Google Charts with the ability to showcase HTML source code within tooltips

I am attempting to show a Pie Chart using Google Charts with HTML in the tooltips, but I am encountering an issue where the HTML source is visible. I have tried setting html:true on the data column and tooltip.isHtml in the options, but I am unsure of what ...

Exporting canvas as JSON and importing JSON back into canvas

Is there a way to prompt file explorer to open and allow me to select a save location for the JSON file of my canvas when I click the save button? Additionally, how can I load the canvas with the JSON file using the load button? Any guidance on getting s ...

What is the best way to insert a Json array into distinct table rows?

I'm struggling to properly format my json data. My goal is to separate each product and display them in their individual rows. The issue I'm facing is that all the "name" values are being grouped into a single table row rather than each having t ...

Is it possible to update the variable value in one controller from another controller after an http.get request has been made

I have encountered an issue with updating a variable from one controller to another using a service. Despite my efforts, the variable is not being updated. The goal is to have the variable $scope.names in controller 'select' update in controller ...

Customizing variables in webpack for production and development environments

Can a single variable be different in dev and production environments? How should I define this variable to handle the distinction? Is checking the location URL a suitable solution for achieving this? ...

Encountering an error when trying to add Vue Router to a pre-existing Vue.js project

Encountered npm error code ERESOLVE which led to the inability to resolve dependency tree. The error occurred while trying to resolve the dependencies for "[email protected]". It was found that "[email protected]" was present in the vue node_modu ...

The routes directory is inaccessible to express-jwt, resulting in the inability to access req.user

Just getting started with Express... I've noticed that I can access req.user when handling requests in my main app.js file. However, the routes defined in my separate routes folder (specifically routes/users.js) do not have access to req.user, even t ...

Adjusting the background hue of a bootstrap panel

I'm attempting to utilize JavaScript to change the background color of a panel in order to create a "selected" effect. Upon clicking, I retrieve the div by its ID and modify its background color. Although it initially works as intended, the backgrou ...