Angular 6 中 mat-datepicker 的 UTC 日期

本文介绍了Angular 6 中 mat-datepicker 的 UTC 日期的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我在我的 Angular 6 项目中使用了 mat-datepicker.但是在日期选择器中显示当前时区日期.而不是这个，我需要显示当前的 UTC 日期.

这是我的代码

.ts 文件

var nowDate = new Date();this.startdate = nowDate;this.enddate = nowDate;

.html 文件

<input matInput [matDatepicker]="picker_start";占位符=开始日期"[(ngModel)]=开始日期"[ngModelOptions]={timezone: 'UTC'}"><mat-datepicker-toggle matSuffix [for]="picker_start"></mat-datepicker-toggle><mat-datepicker #picker_start></mat-datepicker></mat-form-field>

解决方案

您可以将 Moment.js 与 Material Datepicker 一起使用并相应地设置选项，如下所示:

@NgModule({进口:[MatDatepickerModule，MatMomentDateModule]，供应商: [{ 提供:MAT_MOMENT_DATE_ADAPTER_OPTIONS，useValue:{ useUtc:true } }]})

我在 stackblitz 上创建了一个示例.您可以在选择日期实现和日期格式设置.

I have used mat-datepicker for my Angular 6 project. But in date picker in is showing current timezone date. Instead of this I need to display current UTC date.

Here is my code

var nowDate       =  new Date();
this.startdate    =  nowDate;
this.enddate      =  nowDate;

<mat-form-field style="margin-right: 25px;">
                    <input matInput [matDatepicker]="picker_start" placeholder="Start Date" [(ngModel)]="startdate" [ngModelOptions]="{timezone: 'UTC'}">
                    <mat-datepicker-toggle matSuffix [for]="picker_start"></mat-datepicker-toggle>
                    <mat-datepicker #picker_start></mat-datepicker>
                  </mat-form-field>

解决方案

You can use Moment.js with Material Datepicker and set the options accordingly like below :

@NgModule({
  imports: [MatDatepickerModule, MatMomentDateModule],
  providers: [
    { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } }
  ]
})

I have created a sample on stackblitz. You can find out more at Choosing a date implementation and date format settings.

这篇关于Angular 6 中 mat-datepicker 的 UTC 日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

you

Angular 6 中 mat-datepicker 的 UTC 日期

问题描述