单击按钮即可在浏览器的新选项卡中打开 Sapui5 详细信息页面

open sapui5 detail page in a new tab of the browser on click of a button

本文关键字：Sapui5 详细信息 选项 按钮 浏览器 新选项 单击      更新时间：2023-09-26
<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <script src="resources/sap-ui-core.js"
                id="sap-ui-bootstrap"
                data-sap-ui-libs="sap.m,sap.ui.table,sap.ui.commons"
                data-sap-ui-theme="sap_bluecrystal">
        </script>
        <!-- only load the mobile lib "sap.m" and the "sap_mvi" theme -->
        <script>
                var bFlag;
                sap.ui.localResources("views");
                sap.ui.localResources("i18n");
                sap.ui.localResources("utils");
                jQuery.sap.registerModulePath('Application', 'Application');
                jQuery.sap.require("Application");
                var oApp = new Application({
                    root : "content"
                });
        </script>
<link href="css/stylesheet.css" rel="stylesheet" type="text/css">
    </head>
    <body class="sapUiBody" role="application">
        <div id="content"></div>
    </body>
</html>

我正在开发一个sapui5应用程序，其中我有一个拆分应用程序，现在在工具栏的详细信息页面上，我有一个名为"在新窗口中打开"的按钮。所以我想在单击此按钮后在新选项卡中打开此特定的详细信息页面(仅详细信息页面(。
谁能帮我解决这个问题，就像如何去做一样？

提前谢谢。

问候
沙利尼

使用 SAP 的路由器 API。基本上，在manifest.json文件中定义路由器、路由、模式和目标对象：

"sap.ui5": {
  "rootView": {
    "viewName": "path.to.view.name",
    "type": "XML",
    "async": true
  },
  "routing": {
    "config": {
      "routerClass": "sap.m.routing.Router",
      "viewType": "XML",
      "viewPath": "path.to.view",
      "controlId": "init",
      "controlAggregation": "pages",
      "async": true
    },
    "routes": {
      "init": {
        "pattern": "",
        "target": "init",
        "viewId": "vid_init"
      },
      "target_name": {
        "pattern": "url_parameter",
        "target": "target_name",
        "viewId": "vid_view_name"
      }
    },
    "targets": {
      "target_name": {
        "viewName": "view_name",
        "transition": "show"
      }
    }
  }
}

在按钮的属性中分配 press 事件处理程序：

<Button id="myButton" press=".onOpenNewWindow" />

在视图的控制器中编写代码来处理事件。例：

onOpenNewWindow: funtion(oEvent){
  sap.ui.require([
    "sap/m/library"
  ], sapMLib => sapMLib.URLHelper.redirect("#/url_parameter", /*new window*/true));
},

资源

  • API 参考：sap.m.URLHelper.redirect
  • 文档：路由和导航

基本上，你可以在JavaScript中打开一个新标签，如下所示：

window.open("<yourURL>", _blank');

对于您的 SAPUI5 应用程序，您只需在加载视图/控制器的专用 URL 上提供一个额外的.html文件。如果要将信息从"大纲/详细信息"应用程序传递到新选项卡，可以添加 URL 参数。

正如我在您编辑的问题中看到的那样，您正在使用应用程序。我不知道进一步的结构(尤其是您的应用程序.js的作用(，但在单独的.html中，一个非常简单的解决方案可能如下所示：

<script>
            sap.ui.localResources("views");
            sap.ui.localResources("i18n");
            sap.ui.localResources("utils");
            sap.ui.jsview("name.of.your.detailView").placeAt("content");
</script>

如果要重用 Application.js 文件，可以扩展它并传递一个简单的参数，该参数告诉仅显示一个视图。

还有一件事：我猜你在应用程序中的某个地方使用了sap.m.SplitApp。若要仅显示详细信息视图，此时应改用sap.m.App。

相关文章：