Datetime Picker in Angular 5

Question

I'm using this datetime picker :- https://www.npmjs.com/package/angular2-datetimepicker
Official document link :- https://cuppalabs.github.io/angular2-datetimepicker/#/datetimepicker.

Now, I have successfully implement it. It's perfectly working but time picker is not showing. As per their document I have set timepicker:false as well as timepicker:true.

In component.ts file.

date: Date = new Date();
settings = {
    bigBanner: true,
    format: 'dd-MMM-yyyy hh:mm a',
    defaultOpen: true
}

In component.html file.

 <angular2-date-picker [(ngModel)]="date" [settings]="settings"></angular2-date-picker>

Screen Shot.

Edit :- I think the problem is that setting object is not working from .ts file because if I remove the setting object then also it's only showing date.

Answer 1

This will work as an object from the .ts file. Notice that your HTML file contains a line that your .ts file is missing. The "timePicker: true" line is absent in your .ts settings. So your final settings object in that .ts file should look like this:

settings = {
    bigBanner: true,
    format: 'dd-MMM-yyyy hh:mm a',
    defaultOpen: true,
    timePicker: true
}

As an aside, disabling the bigBanner option with "bigBanner: false" automatically disables the timePicker in this tool. I notice that your's is enabled, but thought it was worth mentioning if others find this solution looking for other reasons that their timePicker is not displaying.