'PrimeNg Calendar: Default time for selecting start date with time - should be start of day time that is 00:00:00

I am using PrimeNg calendar widget with 2 fields that is startDate and endDate.

Currently when selecting startDate, It is showing the selected date with current time but my requirement is, selected date with start of the day time that is 00:00:00.

and when in endDate field, we are are selecting date it is showing selected date with current time but i want selected date with end of the day time that is 23:59:59.

I am using Angular 7 with primeNg(primefaces).

Please help in to short out the issue.



Solution 1:[1]

You can use setHours, setMinutes and setSeconds method of date object. PrimeNg p-calendar uses the date object.

Here it is. component.ts

import { Component } from '@angular/core';
import { FormBuilder } from '@angular/forms';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  date1 = new Date();
  date2 = new Date();
  constructor(){
    this.date1.setHours(0);
    this.date1.setMinutes(0);
    this.date1.setSeconds(0);
    this.date2.setHours(0);
    this.date2.setMinutes(0);
    this.date2.setSeconds(0);
  }
}

Component.html

<div class="ui-g-12 ui-md-4">
        <h3>Start Time</h3>
        <p-calendar [(ngModel)]="date1" [showTime]="true" hourFormat="24"></p-calendar>
    </div>
<br>

<div class="ui-g-12 ui-md-4">
        <h3>End Time</h3>
        <p-calendar [(ngModel)]="date2" [showTime]="true" hourFormat="24"></p-calendar>
</div>

working code

Solution 2:[2]

Here's an example of handling a prime range picker calendar with moment.

onRangeDateFilterApply(): void {
        if (this.rangeDateFilterValue[0] && this.rangeDateFilterValue[1]) {

            const timezoneOffset = moment(this.rangeDateFilterValue[0]).utcOffset();

            this.dateFilter = {
                dateRange: { from: moment(this.rangeDateFilterValue[0]).utc().add(timezoneOffset, 'minutes').startOf('day').format(), to: moment(this.rangeDateFilterValue[1]).utc().add(timezoneOffset, 'minutes').endOf('day').format()}
            }
            // do stuff
        }
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Abhinav Kumar
Solution 2 Bank5z0rSqt