注意:此标记'sapui5'涵盖了通常称为“OpenUI5”的工具包的2013年12月开源版本以及原始许可版本“SAPUI5”。 “用于HTML5的SAP UI开发工具包”(SAPUI5)是一种用户界面技术,用于构建和调整客户端应用程序。 SAPUI5运行时是一个客户端HTML5呈现库,具有丰富的标准和扩展控件以及轻量级编程模型。
最近我遇到了以下JSBin。在“JavaScript”部分,我们可以注意到全局 onUI5Init 侦听器内发生的初始化。这让我有点惊讶,因为所有的人......
赛普拉斯在 sapui5 Web 组件上进行测试,以确保在组合框下拉菜单上点击不可靠
我们在 Cypress 组件和 E2E 测试方面遇到了大量问题。 我们已经使用 V1 中的 Web 组件设置了一个用于 React 应用程序的 SAPUI5 Web 组件。 这一切都与组合框有关
如何正确引用部署在 BTP Cloud Foundry 上的 SAPUI5 组件以嵌入到另一个组件中(重用组件)
在 SAP BTP 上开发 Fiori 应用程序时,我一次又一次遇到同样的问题。我们如何将其他单独部署的组件嵌入到同一个CF Space中。 这是一个
我的自定义控件的数据绑定有问题。 我的控件继承自 sap.m.Input 并使用特殊的值助手对其进行扩展。我的新控件的新属性之一是一个简单的标题...
sap.ui.core.util.File.save 文件损坏?
我想在前端下载一个来自后端的 OData 文件。 该文件使用 FM 'SCMS_BASE64_ENCODE_STR' 进行编码,现在我想对其进行解码并使用 SAPUI5 下载它。 我...
转义符 Unicode 字符 \u000a 只能在 JavaScript 中使用。但是,我尝试在 XML 视图中添加换行符,如下所示。但不起作用: 转义字符 \n 和 Unicode 字符 \u000a 仅适用于 JavaScript。但是,我尝试在 XML 视图中添加换行符,如下所示。但不起作用: <u:TimelineItem text="First Line\n SecondLine" /> 文本控件中的新行可以添加以下字符: 在 XML 视图或 XML 片段中: 换行: 或
。 推荐:* 与 回车符结合使用: 或 
。 在 JS 或 i18n.properties 文件中: 换行:\n或\u000a。 推荐:* 与 回车符结合使用:\r\n 或 \u000d\u000a。 或者,考虑使用 模板文字,而不是手动连接上述字符(即简单地将 "..." 替换为 `...`)。 某些 UI5 控件允许开箱即用 HTML 标签 <br>(在 XML 中:<br>): sap.m.MessageStrip 自 UI5 v1.85 起:API 参考、示例 sap.m.FormattedText:API参考 * 请参阅 不同换行格式的问题。对于大多数互联网协议,建议使用回车符组合。 这是一个带有 sap.suite.ui.commons.TimelineItem* 和 sap.m.Text 的 UI5 演示: globalThis.onUI5Init = () => sap.ui.require([ "sap/ui/core/mvc/XMLView", "sap/m/Text", ], async (XMLView, Text) => { "use strict"; const view = await XMLView.create({ definition: `<mvc:View xmlns:mvc="sap.ui.core.mvc" height="100%"> <App xmlns="sap.m" autoFocus="false"> <Page showHeader="false" class="sapUiResponsiveContentPadding"> <commons:TimelineItem xmlns:commons="sap.suite.ui.commons" text="Multiline supported in Timeline items (XML)" /> <HBox id="myBox" justifyContent="SpaceAround"> <Text text="This is
a text (created in XML view)!" renderWhitespace="true" /> </HBox> </Page> </App> </mvc:View>`, }); const textCreatedInJS = new Text({ renderWhitespace: true, text: "And this\nis\u000aanother\r\ntext (created in JS)!", }); view.byId("myBox").addItem(textCreatedInJS); view.placeAt("content"); }); <script id="sap-ui-bootstrap" src="https://ui5.sap.com/resources/sap-ui-core.js" data-sap-ui-libs="sap.ui.core,sap.m,sap.suite.ui.commons" data-sap-ui-theme="sap_fiori_3" data-sap-ui-oninit="onUI5Init" data-sap-ui-async="true" data-sap-ui-compatversion="edge" data-sap-ui-excludejquerycompat="true" data-sap-ui-xx-waitfortheme="init" ></script> <body id="content" class="sapUiBody"></body> * TimelineItem 在 UI5 的早期版本中存在阻止多行的错误。根据 1.44.5 的变更日志: [修复] sap.suite.ui.commons.Timeline:改进了多行文本的渲染 如果使用控件 sap.m.Text,请记住启用属性 renderWhitespace 和 wrapping 以便在 DOM 中渲染新行。 对于 UI5 控件开发人员 在 DOM 中渲染文本可以通过 .text(/*...*/) 中的 API RenderManager 来实现。然而,即使文本包含上述换行符,该 API 也不一定应用换行符。在这种情况下, white-space 属性 pre-line 可以应用于控件的 CSS 样式: .myControlWithText { /* ...; */ white-space: pre-line; /* Allows line break characters to be applied */ } 而不是 您可以使用表达方式:“”。 例如: Text="{TOPOLINO} - {=${PAPERINO} === 'NA' || ${PAPERINO} === 0 ? '---' : ${PAPERINO}}{PAPERONE} " 您可以使用embeddedControl聚合来使用文本控件 在时间轴项目内 <u:TimelineItem> <u:embeddedControl><Text text="First Line\n SecondLine"></Text></u:embeddedControl> </u:TimelineItem>
我在 Business Applications Studio SAPUI5 的控制器中有此方法,但它无法按预期工作。 我希望使用提供的对象密钥将该文件附加到发票上,该对象密钥适用于...
SAPUI5 演示套件提供代码示例。如何在本地实际使用它们?
我刚刚开始使用 SAPUI5,我实际上很好奇这些示例是如何工作的。 例如:https://ui5.sap.com/#/entity/sap.f.FlexibleColumnLayout/sample/sap.f.sample.FlexibleColumnLayoutColumnRes...
如何在 SAPUI5 中更新 JSON 文件(不仅仅是 JSON 模型)?
我有一个 SAPUI5 应用程序,其中我的模型下有一个 JSON 文件 users.json,如下所示: {“姓名”:“约翰”} 我想通过单击按钮来更新 JSON 文件 {“南...
我的目标是在 Fiori Elements 对象页面的页脚中有两个按钮。 一个按钮是接受实体,另一个按钮是拒绝对象页面上的实体。 为了强调这一点,我想...
如何设置@Conclusion.filter.defaultValue的日期范围?
我正在使用 ABAP Restful 应用程序编程模型 - oData v2。 我希望能够默认指定一个日期范围,例如过去 3 个月内的 CreationDate。 在非常基础的层面上,我可以定义...
语句既不进入 SalesOrder 应用程序,也不在控制台中打印任何错误
我想在启动板中的应用程序之间导航。我通过大量搜索发现,通过 ushell 中的 CrossApplicationNavigation 就是这样。这是文档的链接(SAPUI5...
我无法理解这个问题。我在忽略什么? 这是一个最小示例:https://plnkr.co/edit/VjqGeG9JpHblyLBb?preview 我无法理解这个问题。我忽略了什么? 这是一个最小示例:https://plnkr.co/edit/VjqGeG9JpHblyLBb?preview <tnt:InfoLabel text="{ path: 'LastName', formatter: '.formatter.typeText' }" colorScheme="{ path: 'LastName', formatter: '.formatter.typeColor' }" /> // formatter.js sap.ui.define([], function () { "use strict"; return { typeText: function(sLastName) { // Called with 'sLastName' value }, typeColor: function(sLastName) { // Not called } }; }); 我正在使用 UI5 1.79 和 sap.ui.model.odata.v4.ODataModel。 将 targetType: 'any' 添加到存在问题的属性绑定信息中。 <tnt:InfoLabel text="{ path: 'LastName', formatter: '.getMyText' }" colorScheme="{ path: 'LastName', formatter: '.getMyColorScheme', targetType: 'any' }" /> 使用 v4.ODataModel,属性绑定中的 数据类型 会根据实体属性的 EDM 类型自动确定。 IE。在上面的情况下:即使没有将某个 type 显式分配给 text 属性,v4.ODataPropertyBinding 也会自动选择 String 类型(因为 LastName 在 $metadata 中有 Type="Edm.String")并分配到type: <tnt:InfoLabel text="{ path: 'LastName', formatter: '.getMyText', type: 'sap.ui.model.odata.type.String' <-- automatically added by v4.ODataPropertyBinding }" 这对于 text 属性来说很好,因为它实际上等待 string 值,但对其他属性(例如等待 int 值的 colorScheme)执行相同操作,会导致 FormatException。* 为了防止自动类型确定,必须添加targetType: 'any'。 * 使用 commit:4611772(从 1.80 开始可用),我们可以在控制台中看到相应的错误消息: “Element sap.tnt.InfoLabel#...”的属性“colorScheme”中的FormatException:不是有效的int值。 提示:复合绑定和绑定表达式中引用的单个属性会自动转换为绑定控件属性的类型,除非指定了不同的“targetType”。 targetType:'any' 可能会避免转换并导致预期的行为。 意外定义Expression Binding时,上述错误也适用。尽管表达式绑定语法有效,但请参阅 “属性中的 FormatException ...”错误
我想更改SapUI5中输入控件按向上和向下箭头时的增量步骤,但我无法在文档中找到这样的属性。 我想更改 SapUI5 中输入控件按向上和向下箭头时的增量步骤,但我无法在文档中找到这样的属性。 <Input type="Number" value="{/config/value}" liveChange="onPriceChange" editable="true"/> HTML 中的输入有类似“step”属性的东西吗? 您可以尝试使用 sap.m.StepInput 的属性 step 来代替。 不,SAPUI5 中没有“step”属性,因为“Number”类型的 sap.m.Input 完全依赖于 HTML5 输入。也许你可以更新 DOM 元素中的“step”属性。 我们现在可以通过在命名空间声明 xmlns:html="http://www.w3.org/1999/xhtml" 来在 SAPUI5 中使用 HTML 标签,并使用我们希望拥有的任何 html 标签。 示例代码: <mvc:View controllerName="com.sap.demo.DemoApp.controller.Master" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" displayBlock="true" xmlns="sap.m" xmlns:core="sap.ui.core"> <Page id="idPage" title="Demo App"> <content> <!-- Use 'html:' before whichever html tag you want to use --> <html:input type="number"/> </content> </Page> </mvc:View> 希望这有帮助!
您能告诉我如何在SAPUI5中的OData V4中执行OData Read吗? 我可以在 OData V2 中轻松完成此操作,如何使用 oData V4 实现类似的功能? this_.getOwnerComponent().getModel("我的...
我正在设计一个基本布局。我想在与图标选项卡栏相同的行中添加一个按钮。我可以找到任何解决方案。上面贴了一张图片供参考。 我正在设计一个基本布局。我想在与图标选项卡栏相同的行中添加一个按钮。我可以找到任何解决方案。上面贴了一张图片供参考。 <mvc:View controllerName="Workspace.test01.controller.App" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" xmlns:core="sap.ui.core"> <Page title="{i18n>homePageTitle}"> <content> <IconTabBar id="idIconTabBarNoIcons" class="sapUiResponsiveContentPadding"> <items> <IconTabFilter text="abc" class="Tabheader"> </IconTabFilter> <IconTabFilter text="fdvvvfv"></IconTabFilter> <IconTabFilter text="vdfvvdvvv"></IconTabFilter> <IconTabFilter text="Avfdsd"></IconTabFilter> </items> </IconTabBar> </content> </Page> 您可以使用 HBox 和 layoutData 来实现 <l:VerticalLayout width="100%" > <HBox> <IconTabBar> <items> <IconTabFilter text="abc" class="Tabheader"> </IconTabFilter> <IconTabFilter text="fdvvvfv"></IconTabFilter> <IconTabFilter text="vdfvvdvvv"></IconTabFilter> <IconTabFilter text="Avfdsd"></IconTabFilter> </items> <layoutData> <FlexItemData growFactor="2" /> </layoutData> </IconTabBar> <Button text="Button" class="sapUiSmallMarginTop sapUiTinyMarginBegin" /> </HBox> </l:VerticalLayout> 输出 您可以使用按钮添加聚合,但随后它会呈现在 IconTabBar 下方。我想你最好的选择是扩展 IconTabBar 并创建一个接受聚合中按钮的自定义控件。 也许可以使用这个 SAPUI5 控件:https://sapui5.hana.ondemand.com/#/api/sap.m.TabContainer%23overview
我有一个 ToolPage 应用程序。 SideContent 的内容需要从 Firestore 集合读取的响应中填充,这是异步的(承诺)。 到目前为止,每一次尝试解决这个问题......
给定一个ES模块字典API.mjs: 导出 const DICTIONARY_API = Object.freeze({ 一些键:“一些值” }); 我想将其导入到我的 UI5 控制器中。据我了解,UI5 确实...
我创建了一个UI5主从页面: 掌握 我创建了一个 UI5 主从页面: 大师 <List items="{som>/Users}"> <StandardListItem type="Navigation" press="onItemPress" title="{som>UserName}" /> </List> onItemPress: function(oEvent) { var oUserContext = oEvent.getSource().getBindingContext("som"); var oUser = oUserContext.getObject(); this.getRouter().navTo("userDetails", {userId: oUser.Id}); } 详情 onInit: function () { var route = this.getRouter().getRoute("userDetails"); route.attachPatternMatched(this._onObjectMatched, this); }, _onObjectMatched: function (oEvent) { var sUserId = oEvent.getParameter("arguments").userId; this.getView().bindElement({ path: "som>/Users('"+sUserId+"')", model: "som" }); }, reload: function() { this.getView().getModel("som").refresh(); }, <fLayout:SimpleForm id="userForm"> <Button text="reload" press="reload"/> <Label text="{i18n>settings.user.id}"/> <Input editable="false" value="{som>Id}"/> <Label text="{i18n>settings.user.username}"/> <Input value="{som>UserName}"/> <Label text="{i18n>settings.user.email}"/> <Input value="{som>Email}"/> <Label text="{i18n>settings.user.firstname}"/> <Input value="{som>FirstName}"/> <Label text="{i18n>settings.user.lastname}"/> <Input value="{som>LastName}"/> </fLayout:SimpleForm> 一切正常。但是,当我在详细视图中更改用户时,它会被更新,但不会在主视图中更新!通过reload方法,我可以手动刷新它。但是我怎样才能在更改后自动触发它呢?我可以在 SimpleForm 上绑定更改事件吗? 自 UI5 1.99 起 请参阅 OData V4 主题 数据重用 中的“相对绑定”部分。另请参阅: 演示套件示例:“草稿处理和数据同步” 无草稿的最小样本:https://plnkr.co/edit/qatUyq 之前的解决方案 如果目标 UI5 版本没有提供可以帮助保持绑定数据同步的 API,或者,应用程序本身可以识别相关绑定并手动刷新它们: $$updateGroupId: 'myGroupId' 用于上下文绑定(详细信息页面)。 用户按下提交后,从列表绑定(主列表)中调用refresh("myGroupId")。 最后submitBatch("myGroupId")。 如果我们检查请求负载,我们可以看到 PATCH 和 GET 请求被捆绑在一起。因此,主列表会同时刷新。 使用 OData V4 TripPin 服务的最小示例 注意 虽然这两个请求(GET 和 PATCH)捆绑为一个,但框架确保更新后始终应用刷新列表: OData V4 模型自动将所有非 GET 请求放入单个更改集中,该更改集位于批量请求的开头。所有 GET 请求都放在它的after 后面。 [...] (来源:批量控制) 与v2.ODataModel不同: v4.ODataModel中的默认绑定模式是"TwoWay"(除非sharedRequests设置为true)。 IE。 UI 更改模型数据,反之亦然。 无需事先将组添加到“延迟组”即可调用 v4.ODataModel#submitBatch,因为 V4 简化了批处理组的处理: 应用程序组默认是延迟的;无需设置或获取延迟组。您只需要模型上的submitBatch 方法来控制批处理的调用。 [...] (来源:与 OData V2 模型相比的变化) 希望我把一些事情说得更清楚了。上述引用和有关 UI5 中 OData V4 的最新文档可以在 https://sdk.openui5.org/nightly/#topic/5de13cf4dd1f4a3480f7e2eaaee3f5b8. 找到。 V4 模型有承诺。 提交更改时可以使用.then(),这样就可以刷新模型。 ... var oView = this.getView(); function refreshModel() { oView.getModel().refresh(); } oView.getModel().submitBatch(sGroupId).then(refreshModel); ... https://sapui5.hana.ondemand.com/#/api/sap.ui.model.odata.v4.ODataModel/methods/submitBatch
使用 sap.m.Shell 为 Android 和 ios 提供单独的主页图标
当前的ui5文档根据手机、平板电脑等设备类型动态选择图标: 函数(外壳,组件容器){ 新外壳({ 主页图标:{ 夫...