Primeng 12 P-Calendar UTC问题

发布于 2025-02-12 01:14:01 字数 339 浏览 1 评论 0原文

我对Primeng日历组件有问题。我需要在日历中从选定的值中删除UTC。选择日历组件中的日期，表单值为：

Wed Jun 01 2022 00:00:00 GMT+0200 (Ora legale dell’Europa centrale)

因此，当我调用通过此值的rest服务传递时，它会转换为：

"2022-05-31T22:00:00.000Z"

我知道这是与UTC相关的问题，但我找不到一种方法来删除UTC设置属性进入p-calendar。有办法这样做吗？还是可以将所选值管理为指令？我正在使用Primeng 12.2.16

原文

I've a problem with PrimeNg Calendar component. I need to remove UTC from selected value in calendar. Selecting a date in the calendar component, the form value is:

Wed Jun 01 2022 00:00:00 GMT+0200 (Ora legale dell’Europa centrale)

so when i call a rest service passing this value, it is converted into:

"2022-05-31T22:00:00.000Z"

I know it's a problem related to UTC but I can't find a way to remove UTC setting attributes into p-calendar.
Is there a way to do this? Or it's possibile to manage the selected value into a directive?
I'm using PrimeNg 12.2.16

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

栩栩如生 2025-02-19 01:14:01

对我来说，我做了一个指令和日期偏移校正的解决方案：

import { Calendar } from 'primeng/calendar';
import { Directive } from '@angular/core';

@Directive({
  selector: '[utcCalendar]',
})
export class UtcCalendarDirective {

  constructor(private pCalendar: Calendar) {

    // Function was taken from
    // https://github.com/primefaces/primeng/blob/master/src/app/components/calendar/calendar.ts

    pCalendar.updateModel = (value) => {
      pCalendar.value = value;

      if (pCalendar.dataType == 'date') {
        // Changes
        const date = new Date(pCalendar.value);
        date.setTime( date.getTime() + (-date.getTimezoneOffset())*60*1000 );
        pCalendar.onModelChange(date);
      }
      else if (pCalendar.dataType == 'string') {
        if (pCalendar.isSingleSelection()) {
          pCalendar.onModelChange(pCalendar.formatDateTime(pCalendar.value));
        }
        else {
          let stringArrValue = null;
          if (pCalendar.value) {
            stringArrValue = pCalendar.value.map((date: any) => pCalendar.formatDateTime(date));
          }
          pCalendar.onModelChange(stringArrValue);
        }
      }
    };
  }
}

然后当我进行value.toisostring（）时，它将给出一个日期，例如'2022-09-12T00：00.000：00.000 z'。

用表格测试。 OnSelect（）之类的输出不会更改其他功能，但您可以改进此代码。

For me I made a solution with a directive and date offset correction:

import { Calendar } from 'primeng/calendar';
import { Directive } from '@angular/core';

@Directive({
  selector: '[utcCalendar]',
})
export class UtcCalendarDirective {

  constructor(private pCalendar: Calendar) {

    // Function was taken from
    // https://github.com/primefaces/primeng/blob/master/src/app/components/calendar/calendar.ts

    pCalendar.updateModel = (value) => {
      pCalendar.value = value;

      if (pCalendar.dataType == 'date') {
        // Changes
        const date = new Date(pCalendar.value);
        date.setTime( date.getTime() + (-date.getTimezoneOffset())*60*1000 );
        pCalendar.onModelChange(date);
      }
      else if (pCalendar.dataType == 'string') {
        if (pCalendar.isSingleSelection()) {
          pCalendar.onModelChange(pCalendar.formatDateTime(pCalendar.value));
        }
        else {
          let stringArrValue = null;
          if (pCalendar.value) {
            stringArrValue = pCalendar.value.map((date: any) => pCalendar.formatDateTime(date));
          }
          pCalendar.onModelChange(stringArrValue);
        }
      }
    };
  }
}

And then when I do value.toISOString() It will give a date like '2022-09-12T00:00:00.000Z'.

Tested with forms. Outputs like onSelect() and some other functionality won't be changed but you can improve this code.

回复收藏 0 原文

~没有更多了~