getDateTimeInstance():不同区域设置的不同行为

问题描述 投票:0回答:1

我正在使用此功能进行日期格式

// DateFormat required from "sap/ui/core/format/DateFormat"
DateFormat.getDateTimeInstance({ pattern: "yyyy-MM-dd HH:mm" });

该格式在“DE”中工作正常,但在“EN”中返回错误的值。 在两种语言中,时间均为 24 小时。我需要的是:

  • 在英语中,时间文本应包含 AM 或 PM。
  • 在德语中,时间文本应采用 24 小时格式。

如何实现这一目标?

目标UI5版本:1.108

javascript datetime time sapui5 cldr
1个回答
1
投票

根据Unicode的日期字段符号表

  • HH
    对应“24小时循环格式”
  • hh
    对应“12小时周期格式”
  • jj
    “是 [...] 请求区域设置的首选时间周期类型(12 小时或 24 小时)的唯一方法。”

如果没有其他要求,我强烈建议不要在格式选项中对

pattern
进行硬编码,以便 让框架根据用户区域设置格式化日期和时间。您可以 使用
format
选项
指定在格式化日期时间值时要合并哪个符号(例如,用
jj
代替
hh
HH
)。

运行此代码片段以查看结果:

globalThis.onUI5Init = () => sap.ui.require([
  "sap/ui/core/format/DateFormat",
  "sap/ui/core/Locale",
  "sap/ui/core/Configuration",
  "sap/m/VBox",
  "sap/m/ObjectStatus",
], (DateFormat, Locale, Configuration, VBox, ObjectStatus) => {
  "use strict";
  const currentUserLocale = Configuration.getLanguageTag();
  const control = new VBox({
    items: [
      new ObjectStatus({
        title: "Locale \"de-DE\"",
        text: DateFormat.getDateTimeInstance({
          format: "yMdjjmm",
          UTC: true,
        }, new Locale("de-DE"))
          .format(new Date(new Date().setUTCHours(23, 0)))
      }),
      new ObjectStatus({
        title: "Locale \"en-US\"",
        text: DateFormat.getDateTimeInstance({
          format: "yMdjjmm",
          UTC: true,
        }, new Locale("en-US"))
          .format(new Date(new Date().setUTCHours(23, 0)))
      }),
      new ObjectStatus({
        title: `Your Preferred Locale ("${currentUserLocale}")`, // Detected locale as per https://sdk.openui5.org/topic/91f21f176f4d1014b6dd926db0e91070
        text: DateFormat.getDateTimeInstance({
          format: "yMdjjmm",
          UTC: true,
        }).format(new Date(new Date().setUTCHours(23, 0)))
      })
    ],
    renderType: "Bare",
  });

  control.addStyleClass("sapUiTinyMargin").placeAt("content");
});
<script id="sap-ui-bootstrap"
  src="https://sdk.openui5.org/nightly/resources/sap-ui-core.js"
  data-sap-ui-libs="sap.ui.core,sap.m,sap.ui.layout,sap.ui.unified"
  data-sap-ui-async="true"
  data-sap-ui-oninit="onUI5Init"
  data-sap-ui-compatversion="edge"
  data-sap-ui-excludejquerycompat="true"
  data-sap-ui-xx-waitfortheme="init"
></script>
<body id="content" class="sapUiBody sapUiSizeCompact"></body>

今天 23:00:00Z 给出:

区域设置“de-DE”:2023 年 4 月 28 日,23:00
区域设置“en-US”:2023 年 4 月 28 日晚上 11:00

API参考:

sap/ui/core/format/DateFormat.getDateTimeInstance


可以通过

type
formatOptions
以声明方式在 XML 内的属性绑定中实现相同的效果。

<SomeControl xmlns="..."
  xmlns:core="sap.ui.core"
  core:require="{ DateTimeOffset: 'sap/ui/model/odata/type/DateTimeOffset' }"
  someControlProperty="{
    path: 'myODataModel>...',
    type: 'DateTimeOffset',
    formatOptions: {
      format: 'yMdjjmm'
    },
    ...
  }"
/>

API参考:

sap/ui/model/odata/type/DateTimeOffset

文档(必读):日期、时间、时间戳和时区
文档:数据绑定 - 格式化、解析和验证数据(XML 格式)

© www.soinside.com 2019 - 2024. All rights reserved.