如何更改 P13nItem TimePicker/DatePicker 上的显示格式?

我正在尝试在所选列类型为日期/时间时更改SAP.M.P13NITEM使用的DatePicker / TimePicker上的显示格式。


我曾尝试更改 P13nFilterPanel 中的聚合 P13nItem 以包含属性 formatSettings,但它不起作用。


这是我的 XML 视图代码示例。


<P13nFilterPanel id="filterPanel" visible="true" type="filter" containerQuery="true" items="{

                    path: 'SchedulingFilter>/ColumnCollectionFilter'

                }" filterItems="{

                    path: 'SchedulingFilter>/FilterItems'

                }">

                <P13nItem columnKey="{SchedulingFilter>columnKey}" text="{SchedulingFilter>label}" type="{SchedulingFilter>type}" maxLength="{SchedulingFilter>maxLength}" formatSettings="{SchedulingFilter>formatSettings>" />

                <filterItems>

                    <P13nFilterItem columnKey="{SchedulingFilter>keyField}" operation="{SchedulingFilter>operation}" value1="{SchedulingFilter>value1}" value2="{SchedulingFilter>value2}" exclude="{SchedulingFilter>exclude}" />

                </filterItems>

            </P13nFilterPanel>

这是我如何填充绑定数据的摘录。


$.each(columnsKeys, function (i, item) {

            const columnData = {};

            const columnDescriptionItem = columnDescription[item];

            columnData.columnKey = item;

            columnData.text = columnDescriptionItem.label;

            columnData.type = columnDescriptionItem.type;

            columnData.formatSettings = {

                pattern: 'yyyy/MM/dd',

                UTC: false

            };

            columnData.maxLength = columnDescriptionItem.maxLength;

            columnData.visible = columnDescriptionItem.visible;

            columnData.index = columnDescriptionItem.index;

            columnData.isEditable = columnDescriptionItem.isEditable;

            columnData.isFilter = columnDescriptionItem.isFilter;

            columnData.isSorter = columnDescriptionItem.isSorter;

            columnsData.push(columnData);

        });

控件的默认行为将时间/日期字段显示为: https://ibb.co/JcJJZhJ。


编辑:我发现默认行为基于用户的语言环境。我不考虑用户的语言环境来更改应用程序其他部分的显示格式。


例如,我想在这些字段上实现“yyyy/MM/dd”和“hh:mm:ss”的显示格式。


BIG阳
浏览 225回答 1
1回答

MMMHUHU

为了解决这个问题,我不得不在 SAPUI5 的 1.44.6 版本上扩展 P13nConditionPanel(这个负责时间/日期组件实例化)和 P13nFilterPanel(它创建 P13nConditionPanel)。我只需要向 DatePicker 和 TimePicker 构造函数添加必要的参数(如下所示)。case "date":&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; oConditionGrid.oFormatter = sap.ui.core.format.DateFormat.getDateInstance();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; params.displayFormat = DateFormatter.displayFormat();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; oControl = new sap.m.DatePicker(params);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; break;case "time":&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; oConditionGrid.oFormatter = sap.ui.core.format.DateFormat.getTimeInstance();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; params.displayFormat = TimeFormatter.getDisplayFormat();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; oControl = new sap.m.TimePicker(params);我在 pastebin 上发布了我定制的扩展组件代码:定制 P13nConditionPanel定制的 P13nFilterPanel稍后我将在 openui5 Github 上打开一个增强请求。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript