CODEWITHSUNDEEP
javascriptangular
Robbie Mills
Robbie Mills

Reputation: 2945

Adding a time to a Javascript date

I'm trying to add a time to a date in my Angular application.

I have a date picker (appointmentDate) that returns a Javascript date and a select box that has times (appointmentTime) in the following value:

"8:00"
"8:30"
"9:00"

etc

I'm not sure how I can create a date object with the correct time.

I can do the following which creates a date with a 00:30 time:

var s = new Date(this.appointmentForm.controls.appointmentDate.value);
s.setMinutes(s.getMinutes()+30);

But I'm not sure how to make the time component 8:30 if the user selects 8:30 in the appointmentTime select box.

Upvotes: 0

Views: 133

Answers (2)

Nicholas Carey
Nicholas Carey

Reputation: 74177

If you are trying to add time to an instance of Date, you'll want to do something like this:

const SECONDS_PER_MINUTE = 60 ;
const SECONDS_PER_HOUR   = 60 * SECONDS_PER_MINUTE ;

const dtNow = new Date();
console.log(`original: ${dtNow}`);

const dtThen = addTime(dtNow, "08:15");
console.log(`changed:  ${dtThen}`);

function addTime(dt, duration) {
  const rxDuration = /^\s*(\d\d):(\d\d)\s*$/;
  const match = rxDuration.exec(duration);

  if (!dt instanceof Date) throw new Error("Invalid dt: dt is not a Date");
  if (!match) throw new Error(`Invalid duration: ${duration}`);

  const [ , hours, minutes ] = match;
  let millisecondsSinceEpoch = dt.valueOf();

  millisecondsSinceEpoch +=  1000 * (
        hours * SECONDS_PER_HOUR
      + minutes * SECONDS_PER_MINUTE
  );

  return new Date(millisecondsSinceEpoch);
}

If you want to set the time component of a date, you could do something like this:

function setTime( dt , duration ) {
  const rxDuration = /^\s*(\d\d):(\d\d)\s*$/;
  const match = rxDuration.exec(duration);

  if (!dt instanceof Date) throw new Error("Invalid dt: dt is not a Date");
  if (!match) throw new Error(`Invalid duration: ${duration}`);

  const [ , hours, minutes ] = match;

  return new Date( dt.getFullYear(), dt.getMonth(), dt.getDate(), hours, minutes, 0, 0 );
}

But in all honesty, I'd probably do something like this, using moment.js or luxon:

const moment = require("moment");
. . .
const appointmentDateTime = moment.parseTwoDigitYear( appointment.date )
                            .hours( appointment.hour)
                            .minutes( appointment.minute)
                            ;

Because life is too short to write boilerplate.

Upvotes: 1

Murat Aras
Murat Aras

Reputation: 401

You can convert selected time to minutes like below

var appointmentTimeItems = appointmentTime.split(":");
var hoursPart = parseInt(appointmentTimeItems[0]);
var minutesPart = parseInt(appointmentTimeItems[1]);
var minutes = (hoursPart * 60) + minutesPart;

You can use setHours(hoursPart).setMinutes(minutesPart) or setMinutes(minutes)

Upvotes: 0

Related Questions