I am using ion-datetime for my appointment form. While inserting it is working fine without any problem. But when I need to update the inserted appointment date form details from back end, the date value is not displaying in ion-datetime.
Below is my code:
update.html:
<ion-item class="border-bottom">
<ion-label class="ionselect" >Appointment Date:</ion-label>
<ion-datetime name="appdate" displayFormat="YYYY MMM DD" [(ngModel)]="leadDetailsUpdate.appt_date"></ion-datetime>
</ion-item>
update.ts:
leadDetailsUpdate={
appt_date:''
};
The Date format I am getting from back end as follows:
appt_date: "2017-01-01"
Below is the error message I am getting in console:
Error parsing date: "null". Please provide a valid ISO 8601 datetime format: https://www.w3.org/TR/NOTE-datetime
convert it to ISO format before displaying
var date = new Date('2017-01-01').toISOString()
console.log(date)
Even Gaurav is right, I found that if your timezone is not +0, you can have problems with that. I found somewhere this solution:
let tzoffset = (new Date()).getTimezoneOffset() * 60000; //offset in milliseconds
this.startTime = (new Date(this.myStartTime - tzoffset)).toISOString().slice(0,-1);
Then in my HTML I have it like this:
<ion-datetime displayFormat="HH:mm" [(ngModel)]="startTime" (ionChange)="changeCheckOutStartTime()" style="padding-left: 21px"></ion-datetime>
And in the changeCheckOutStartTime() method, I take the time and create a moment:
changeCheckOutStartTime() {
this.myStartTime = moment(this.startTime).toDate();
}
Using ISO format before displaying, like this:
this.myDate = new Date('2017-01-01').toISOString()
Will give us a difference of hours, each browser would do something different. In my case I had a difference of 5 hours (16/12/17 02:00 would be 16/12/17 07:00).
A better way would be to use moment as ionic recomends on its documentationn (https://ionicframework.com/docs/api/components/datetime/DateTime/#advanced-datetime-validation-and-manipulation)
Example:
Open console at root proyect and install moment: npm install moment --S.
Import moment in component file: import moment from 'moment';.
Set value of model variable: this.myDate = moment().format().
The best would be create a pipe. Well check this demo http://plnkr.co/edit/MHjUdC for inspiration, goog luck :)
Related
Im fetching some data from firestore, the date fields are in the format of {seconds: XXXXX, nanoseconds: XXXXX}. React Native complains about this saying this format is not a serializable value so to those fields I do this:
docData.createdAt.toLocaleString()
That gives me dates in the following format:
Timestamp(seconds=13223213, nanoseconds=12312312)
When I want to render those date fields with a human format like ISOString or LocaleDateString or anything it doesnt let me.
I've tried to do new Date(createdAt) but that gives me NaN.
I've also tried createdAt.toDate() | createdAt.toISOString() it doesnt recognize the functions.
I've also tried Timestamp.fromDate(createdAt) but it doesnt work either.
I want to get my dates in a human reading format like DD/MM/YYYY HH:mm:ss
Here some pieces of code:
Fetching data:
Some of my attempts
I'd like to have some hints or ideas or how to approach this issue.
****we can use this format ..... work for me ****
import moment from 'moment'; <--- import this line
const timestamp = 1676238124;
const nanoseconds = 838000000;
const Date = moment.unix(timestamp).add(nanoseconds / 1000000, 'milliseconds');
const Fordate = Date.format('YYYY-MM-DD HH:mm:ss.SSS');
console.warn(Fordate)
Although the above answer works, this is what I did:
The issue was caused because of the SerializableCheck from redux [https://redux-toolkit.js.org/api/serializabilityMiddleware] so I decided to set this middleware to false so It won't cause this error.
This is a StackOverFlow question about this topic that I found [https://stackoverflow.com/questions/61704805/getting-an-error-a-non-serializable-value-was-detected-in-the-state-when-using]
Now, about the date formats I did some changes:
Having disabled the serializeCheck option, now I can use .toDate() functions
Now wherever I need a date in a specific format I simply use a global function that receives two params: date & format and using momentJS the rest is easy.
I tried all the solutions i found here but none work.
Im just trying:
var a = new Date();
console.log(a);
//2020-01-12T05:05:17.320Z
//Time in my timezone: 2020-01-12T02:05:17.320Z
I'm from Brazil, o the timezone is -3:00
I already installed moment.js and tryed:
var moment = require('moment-timezone');
moment().tz("America/Sao_Paulo").format();
var a = new Date();
console.log(a);
but i keep getting whithout my timezone. I also tryed setting the TZ without the moment.js and didn't work.
I cant use some solution that change the way to call the "new Date()" because I have to parse a string to an object that contains Date and I use Prompts module, that get a date from console, that already return a date. I don't know what to do more.
Thanks for any help.
*I'm running on Windows, and the time is right, the configuration is pointing to the right timezone
edit1: more info
The best way that I found was add 'getTimezoneOffset' (minutes) using moment.js
//Will returns the current "wrong" time in formart '2020-09-29T19:47:46.411Z'
//Expect: 2020-09-29T16:47:46.411Z
console.log(new Date())
So if you want see the full date in format ('DD-MM-YYYY HH:mm') of any object
var moment = require('moment')
// specificDay is a Date (type: Object) like '2020-09-22T00:00:00.000Z'
// previously retrieved from the database without information about the time('HH:mm')
// Only with 'YYYY-MM-DD'
moment(specificDay, "YYYY-MM-DD").add(new Date().getTimezoneOffset(),'minute').format('DD-MM-YYYY HH:mm')
You're very close. Moment is a Javascript library that makes formatting time very easy. You are creating your moment object, but you're not outputting it.
I made a very slight change (2nd line) and it works as expected:
var moment = require('moment-timezone');
console.log(moment().tz("America/Sao_Paulo").format());
If you want it formatted nicely, see this page: https://momentjs.com/.
For example:
console.log(moment().tz("America/Sao_Paulo").format('lll'));
// output: Jan 12, 2020 2:45 AM
How does it work?
moment() creates a time object (just like new Date(), but it's moment's special time object). .tz() is calling the timezone function and we give it your time zone as a string "America/Sao_Paulo". .format() then outputs it in a nice custom string. console.log() outputs the whole string to the screen.
Node takes UTC timestamp
https://www.google.com/search?client=firefox-b-d&q=current+utc+time+online
So you can convert to a locale string and after that create a new date. This is a example for mexico city
let mx = (new Date()).toLocaleString('se-SE',{ timeZone: 'America/Mexico_City'}) + "Z";
return new Date(mx);
I am looking for to convert this date and time to relative time like twitter have ex. 5 sec ago or 1 month ago.
I have stored date and time in different column of database.
i am executing this in JavaScript, i tried Momentjs but it does not work well or i may not understand its format or flow of work.
i am little new to javascript, i started learning react a week ago
from database:
date =>31.03.2019 time=>16:06:05
Thank You For Help.
Success Update :
Mission was to convert "31.3.2019 19:45:55" this date into a time like twitter or facebook have.
let date = new Date()
var then = request.date +' '+ request.time;
var ms = moment(date,"DD/MM/YYYY HH:mm:ss").diff(moment(then,"DD.MM.YYYY HH:mm:ss"));
var d = moment.duration(ms);
var s = Math.floor(d.asHours()) + moment.utc(ms).format(":mm:ss");
var timeAgo = d.humanize();;
In moment we can define the format of date we are passing and with humanize function its easy to get the desire output.
What i didnt know was the definition of format of date we pass. #NOW I AM CLEAR SIR.
Thank You For Helping Everybody. Thank You For Sharing .
You can use moment js
let date = new Date()
console.log(moment(date).fromNow())
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
I am working on sample react-native app.
I am using moment.js to convert time to AM and PM representations.
My data is:
{
"start_date":"2017-09-29T18:29:59.000Z",
"end_date":"2017-09-29T19:29:59.000Z"
}
When converting the start_date and end_date to 12 hour clock format (AM/PM) using moment().format('LT'), I get the wrong time i.e. 11:59 PM for start_date - 12:59 AM for end_date.
How do I get the right time and format?
The comments are correct, since you are passing 2017-09-29T18:29:59.000Z it will turn to 11:59pm under your locale.
But LT as a format will really just return the time. Try using MM-DD-YYYY hh:mm:ss a for the format string.
You can check more here at the moment docs
I also made fiddle for you to play around with.
Hi I am trying to figure out how to display date properly using angularjs.
My system returns the date in this fromat
c_date="\/Date(1151470800000-0500)\/"
I dont know what format is it.
I am displaying it
using <span>{{pro.c_date | date:'medium')</span>
When i run this i get date printed in same format
"/Date(1151470800000-0500)/"
Can anyone suggest how to fix this so date can be displayed properly.
Thanks
the date that you're trying to use is a invalid date or maybe I don't know what format are the system using.
The problem is that angular.js requires a data object for can format it. Not a date string.
I suppose that the date is 1151470800000 miliseconds since the epoch least 0500 for adjust hours or something.
If this is correct, you only need to make c_date a Date object before pass to view.
c_date = "\/Date(1151470800000-0500)\/";
var the_date = eval("new "+c_date.replace(/\\|\//g, ''));
http://jsbin.com/zuwizoxe/3/
Regards!