Question

我对sap.m.DatePicker有几个奇怪的问题。像往常一样，我通过谷歌搜索主题，他们帮助了我，但并非完全。

我想要实现的目标：我希望sap.ui.table.Column中有一个sap.ui.table.Table，此列应该有template: new sap.m.DatePicker()，日期格式为{ {1}}。

到目前为止我做了什么：我正在使用dd.MM.yyyy从odata服务填充sap.ui.model.odata.v2.ODataModel()。一切顺利，直到我决定将相应列中的日期以首选格式显示。起初，我只使用这些与DatePicker构造函数中的格式相关的属性：

sap.ui.table.Table

这样，所有日期都以下列格式显示：displayFormat: "dd.MM.yyyy", valueFormat: "yyyy-MM-dd", //... value = "{" + fieldName + "}"（我不知道如何使用格式字符串表达它）。我记得昨天在文档中读到，当我有绑定时，displayFormat会被忽略，对我来说是......我不明白为什么会这样。

无论如何，我找到了一个解决方案，它提供了如下设置值的建议：

Sun Aug 06 2017 03:00:00 GMT+0300 (FLE Daylight Time)

首先，它似乎工作正常并且日期格式化并正确显示，但是当我尝试连续修改日期时...例如，我选择2017年8月6日。通过数据库保存到数据库的内容是什么odata服务是2017-06-08 00：00：00.000这不是8月6日，而是6月8日。我选择8月2日 - 在数据库中我看到2017-02-08 00：00：00.000 - 2月8日。似乎像月和日切换。例如，如果我选择，例如，8月30日，则不会保存更改。据我所知，问题是什么 - 没有数字30的月份，所以它拒绝保存它。完全有道理。：d

然后我尝试添加/取消注释行value: { path: colName, type: new sap.ui.model.type.Date({ pattern: "dd.MM.yyyy" //source: { pattern: "yyyy-MM-dd HH:mm:ss:fff" } }) }。现在，对于每一行，日期列显示为空，就好像数据库中的每一行都在该日期列中的值为空。

接下来，我尝试从DatePicker模板的定义中删除source: {} - 没有任何更改。有趣的是 - 无论我是否删除这两行，我仍然可以更改行的日期（更改将保存到数据库中），尽管仍然会切换月和日。

然后我遇到另一个解决方案，它说，我应该添加一个这样的格式化程序：

displayFormat: "dd.MM.yyyy", valueFormat: "yyyy-MM-dd"

这样，它似乎都应该工作。现在你可能会问我是否放弃使用value: { path: colName, formatter: function (val) { return sap.ui.core.format.DateFormat.getDateInstance({ pattern: "dd-MM-yyyy" }).format(val); } };格式。答案是“不！”，它只是不起作用。

所以，这是我要问的主要问题：这种格式有什么问题？无论我使用什么其他符号，逗号，破折号，它总是有效（dd.MM.yyyy）。日期显示相应的符号。当我尝试使用dd-MM-yyyy or dd,MM,yyyy时，它会出现以下错误：和那样：

谢谢大家的帮助！会很感激！

编辑：我刚想出解决此问题的想法。不幸的是，它不起作用并产生完全相同的错误，如上所述的图片。以下是非工作解决方案：dd.MM.yyyy

Answer 1

尝试使用“dateValue”+“displayFormat”属性，例如：

https://plnkr.co/edit/wkHv9s?p=preview

<DatePicker
    dateValue="{testModel>/myDate}"
    displayFormat="dd.MM.yyyy" />

Answer 2

sap.m.DatePicker，日期格式为dd.MM.yyyy

我正在使用v2.ODataModel。

在这种情况下，请使用以下选项将value绑定：

<DatePicker value="{
  path: 'ReleaseDate',
  type: 'sap.ui.model.odata.type.DateTime',
  formatOptions: {
    pattern: 'dd.MM.yyyy'
  },
  constraints: {
    displayFormat: 'Date'
  }
}"/>

^{（假设"ReleaseDate"的类型为Edm.DateTime）}

这是一个可以运行的演示：

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(SO45750998))/OData/OData.svc/",
    ].join(""),
    tokenHandling: false,
    defaultBindingMode: "TwoWay",
  });
  
  const viewDefinition = `<mvc:View xmlns:mvc="sap.ui.core.mvc" height="100%">
    <DatePicker id="dp" xmlns="sap.m" width="8.25rem" placeholder="Date"
      binding="{
        path: '/Products(0)',
        parameters: {
          select: 'ID, ReleaseDate'
        }
      }"
      value="{
        path: 'ReleaseDate',
        type: 'sap.ui.model.odata.type.DateTime',
        formatOptions: {
          pattern: 'dd.MM.yyyy'
        },
        constraints: {
          displayFormat: 'Date',
          nullable: false
        }
      }"
    />
  </mvc:View>`;

  const createView = () => XMLView.create({
    definition: viewDefinition,
    models: model,
    afterInit: function() {
      const fn = e => e.getSource().getBindingContext().getModel().submitChanges();
      this.byId("dp").attachChange(fn);
    },
  }).then(view => sap.ui.getCore().getMessageManager().registerObject(view.placeAt("content"), true));

  Promise.all([
    sap.ui.getCore().loadLibrary("sap.m", true),
    sap.ui.getCore().loadLibrary("sap.ui.unified", true),
  ]).then(createView);
}));

<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-xx-waitForTheme="init"
></script>
<body id="content" class="sapUiBody sapUiSizeCompact"></body>

正如您在网络面板中所看到的，所选日期已正确发送到OData服务，没有任何问题。只需确保对类型为sap.ui.model.odata.type.DateTime的字段使用类型Edm.DateTime。

有关更多信息，请参见：

文档主题：Date and Time Related Controls: Data Binding
相关问题： How to Add Date / Time from OData Service Correctly to UI?

我无法在sap.m.DatePicker

2 个答案: