UI5 应用程序中的日期不匹配 | 应用程序中的日期不匹配

本文介绍了UI5 应用程序中的日期不匹配的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我在 UI5 应用程序中有一个 DatePicker.我的服务器在澳大利亚.当我在 IST 时间创建任何记录时，它工作正常.但是，当用户尝试在澳大利亚创建任何记录时，日期值会增加 1.即 "31" 作为 "32" 出现.我需要考虑时区吗?

I have a DatePicker in UI5 application. My server is in Australia. When I create any record in IST time, it is working fine. But when a user tries to create any record in Australia, the date value is incremented by 1. That is "31" coming as "32". Do I need to consider the time zone?

推荐答案

如果您使用绑定类型 sap.ui.model.odata.type，UI5 已经负责正确处理日期.DateTime 在 DatePicker 的 value 绑定定义中.

UI5 already takes care of handling dates properly if you use the binding type sap.ui.model.odata.type.DateTime in the value binding definition of your DatePicker.

显示 UTC 日期，将 UTC: true 添加到 formatOptions (可选).
通过将 displayFormat: 'Date' 添加到 constraints 中，以 UTC 格式存储日期.

Display the date in UTC by adding UTC: true to the formatOptions (Optional).
Store the date in UTC by adding displayFormat: 'Date' to the constraints.

在sap.ui.model.odata.v2.ODataModel中，这种类型(sap.ui.model.odata.type.DateTime)表示为日期.使用约束 displayFormat: 'Date'，时区为 UTC，忽略时间部分.

(...) 在这种情况下，仅使用日期部分，时间部分始终为 00:00:00，时区为 UTC 以避免与时区相关的问题.

(...) In this case, only the date part is used, the time part is always 00:00:00, and the time zone is UTC to avoid time-zone-related problems.

这是一个现场演示:

sap.ui.getCore().attachInit(() => sap.ui.require([
  "sap/ui/model/odata/v2/ODataModel",
  "sap/ui/core/mvc/XMLView",
], function(ODataModel, XMLView) {
  "use strict";

  const model = new ODataModel({
    serviceUrl: [
      "https://cors-anywhere.herokuapp.com/", // proxy
      "https://services.odata.org/V2/(S(SO46024229))/OData/OData.svc",
    ].join(""),
    defaultBindingMode: "TwoWay",
    preliminaryContext: true,
    tokenHandling: false, // service does not provide CSRF tokens
  });

  Promise.all([
    sap.ui.getCore().loadLibrary("sap.m", true),
    sap.ui.getCore().loadLibrary("sap.ui.unified", true),
  ]).then(() => XMLView.create({
    definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc" height="100%">
      <DatePicker id="dp" xmlns="sap.m" width="auto" placeholder="Date"
        binding="{
          path: '/Products(0)',
          parameters: {
            select: 'ID,ReleaseDate'
          }
        }"
        value="{
          path: 'ReleaseDate',
          type: 'sap.ui.model.odata.type.DateTime',
          constraints: {
            displayFormat: 'Date',
            nullable: false
          }
        }"
      />
    </mvc:View>`,
    models: model,
    afterInit: function() {
      const fn = e => e.getSource().getBindingContext().getModel().submitChanges();
      this.byId("dp").attachChange(fn);
    },
  }).then(view => {
    const messageManager = sap.ui.getCore().getMessageManager();
    messageManager.registerObject(view.placeAt("content"), true);
  }));
}));

<script id="sap-ui-bootstrap" src="https://ui5.sap.com/resources/sap-ui-core.js"
  data-sap-ui-libs="sap.ui.core"
  data-sap-ui-theme="sap_fiori_3"
  data-sap-ui-async="true"
  data-sap-ui-compatversion="edge"
  data-sap-ui-modules="sap/ui/thirdparty/datajs"
  data-sap-ui-xx-waitfortheme="rendering"
></script><body id="content" class="sapUiBody sapUiSizeCompact"></body>

内部模块datajs 解析传入的 Emd.DateTime 字符串在原生 JS 日期对象中，模块 sap.ui.model.odata.type.DateTime只要不违反约束，就将其存储在模型中.

The internal module datajs parses the incoming Emd.DateTime string in native JS date object, and the module sap.ui.model.odata.type.DateTime stores it in the model as long as the constraints aren't violated.

文档主题:日期和时间相关控件:数据绑定
API 参考:sap.ui.model.odata.type.DateTime

这篇关于UI5 应用程序中的日期不匹配的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！