3

我通过这个例子实现了 Angular 6 日期时间选择器（OwlDatetime）：https://stackblitz.com/github/DanielYKPan/owl-examples/tree/date-time-picker?file=src%2Fapp%2Fbasic%2Fbasic。组件.html。

我也想将输入格式更改为 24 小时格式，因为现在您可以在 stackblitz 中看到选择器具有 24 小时格式，但是一旦选择了时间，它就会以 am/pm 显示在输入中。

我曾尝试更改输入格式，但没有奏效：

<input [owlDateTimeTrigger]="dt"                  [ngModel]="test[key.id] | date: HH:mm" 
[owlDateTime]="dt"  (ngModelChange)="test[key.id]=change($event)" >
                        <owl-date-time [pickerType]="'timer'"  #dt>

有人可以帮忙吗？

4

1 回答 1

4

首先安装：

npm install ng-pick-datetime-moment moment --save;

如果需要附加依赖项，请检查安装日志。像 @angular/core 或 @angular/cdk 等。

然后：定义下一个：

//somefile.ts
static MY_MOMENT_FORMATS = {
        parseInput: 'LL LT',
        fullPickerInput: 'YYYY-MM-DD HH:mm', /* <---- Here i've rewrited the format */
        datePickerInput: 'LL',
        timePickerInput: 'LT',
        monthYearLabel: 'MMM YYYY',
        dateA11yLabel: 'LL',
        monthYearA11yLabel: 'MM YYYY',
    };

并添加根 app.module

//app.module.ts import {OWL_DATE_TIME_FORMATS, OwlDateTimeModule, OwlDateTimeIntl, OWL_DATE_TIME_LOCALE} from 'ng-pick-datetime';

import {MY_MOMENT_FORMATS} from './.../somefile.ts'; 
...
    imports: [
            {provide: OWL_DATE_TIME_FORMATS, useValue: MY_MOMENT_FORMATS}, ]
...

仅此而已。

例子在这里

https://danielykpan.github.io/date-time-picker/#locale-formats

在“将选择器与 MomentJS 一起使用”部分中

于 2018-09-21T04:22:14.697 回答