Angular 5中的日期时间选择器

Question

我正在使用此日期时间选择器：-https: //www.npmjs.com/package/angular2-datetimepicker
官方文档链接：-https : //cuppalabs.github.io/angular2-datetimepicker/#/datetimepicker。

现在，我已经成功实现了它。它工作正常，但没有显示时间选择器。根据他们的文档，我已经设置了timepicker：false和timepicker：true。

在component.ts文件中。

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

在component.html文件中。

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

屏幕截图。

编辑：- 我认为问题是设置对象无法从.ts文件工作，因为如果我删除设置对象，那么它也只会显示日期。

Answer 1

这将用作.ts文件中的对象。请注意，您的HTML文件包含缺少.ts文件的行。.ts设置中缺少“ timePicker：true”行。因此，该.ts文件中的最终设置对象应如下所示：

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

顺便说一句，通过“ bigBanner：false”禁用bigBanner选项会自动禁用此工具中的timePicker。我注意到您的已启用，但是如果其他人由于其timePicker未显示的其他原因找到此解决方案，则认为值得一提。

Answer 2

我从 .ts 文件中找出设置对象不起作用的问题。所以，我把它改成了

<angular2-date-picker [(ngModel)]="date" [settings]="{
        bigBanner: true,
        timePicker: true,
        format: 'dd-MMM-yyyy hh:mm a'
    }"></angular2-date-picker>

它正在发挥作用。

注意：-我已经在 Angular-5 中尝试了 4-5 个日期时间选择器，这是唯一有效的日期时间选择器。所以我们可以使用它。