Default date in prime-ng calendar

Question

Hi I am trying to use primeng calendar with datatype as string as follows:

<p-calendar 
    [styleClass]="pCalendar" 
    [dataType]="'string'" 
    formControlName="doC" 
    [inputStyleClass]="priorityDiv" 
    [placeholder]="'MM/DD/YYYY'"
    [showIcon]="false" 
    [yearNavigator]="true" 
    [yearRange]="'2000:2020'" 
    [monthNavigator]="true" 
    [(ngModel)]="doC"
    [inline]="false" 
    showTime="true" 
    hourFormat="12" 
    showButtonBar="true" 
    [minDate]="minDateValue"
    (onSelect)="onDateandTimeSelect($event)" 
    (onInput)="onDateandTimeSelect($event)">
</p-calendar>

I need to set the current date on page load. I tried setting it as :

this.doC = new Date();

But this sets the date as UTC date like "mon 2018 12:34:44 UTC....." while on selecting a date from the picker makes it a simple string as "09/12/2018 11:08 AM"

I need to set the default date as this simple string on initial load. How can I do that? I tried getting ecah and every number from date and concatenate.

var currentDate = new Date();
var dateT = currentDate.getDate();
var c = currentDate.getFullYear();
var f = currentDate.getHours();
var b = currentDate.getMinutes();
var s = currentDate.getMonth();
var w = currentDate.getTime();
var q = currentDate.getUTCDate();
var z = currentDate.toDateString();
var sr = currentDate.toJSON();
var we = currentDate.toString();
var wf = d + s + c + f +":" + b;

But I don't know how to get 'AM/PM' from date.

please help.

please check this link for primeng calendar: https://www.primefaces.org/primeng/#/calendar

well get hours using new Date().getHours() and calculate AM/PM — super cool

Krishna Rathore Krishna Rathore · Accepted Answer · 2018-09-03T06:13:14

You can use DatePipe for that

import { Component } from '@angular/core';
import { DatePipe } from '@angular/common';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [DatePipe]
})
export class AppComponent {
    doC=new date()
    constructor(private datePipe: DatePipe){
       console.log(this.datePipe.transform(this.doC, 'dd/MM/yyyy hh:mm a'))
    }
}

Default date in prime-ng calendar

1 Answers