OpenUI5 路由喜欢 ASP.NET MVC？

Question

我正在尝试构建一个 OpenUI5 应用程序，该应用程序首先通过路由器运行其所有导航配置。 我可以看到我的路线正在发射，但它们从未尝试加载 Controllers/Views。当 OpenUI5 试图找到我丢失的视图时，我希望看到 404 错误。

我正在尝试镜像 ASP.NET，它遵循我所说的 Route-First 方法。在 ASP.NET 中实例化 Controller 之前，Routing 引擎首先需要将 Route 匹配到给定的 URL；然后实例化匹配的控制器。

我只有两个文件，一个 Component.js 文件和一个 index.html 文件。稍后我将添加控制器和视图，但使用我当前的设置，我什至没有看到 OpenUI5 触发任何 HTTP 请求来获取我丢失的 Controllers/Views.

Component.js

Query.sap.declare("cag.sbx.Component");
sap.ui.core.UIComponent.extend("cag.sbx.Component",
{
    metadata:
    {
        name: "OpenUI5 Simple Routing",
        includes: [],
        dependencies: {
            libs: ["sap.m", "sap.ui.layout"],
            components: []
        },
        routing:
        {
            config:
            {
                viewType: "JS",
                viewPath: "cag.sbx.views",
                targetControl: "emptyElement",
                clearTarget: false
            },
            routes:
            [
                {
                    pattern: "products/{id}",
                    name: "product",
                    view: "Products"
                },
                {
                    pattern: "",
                    name: "default",
                    view: "Home"
                }
            ]
        }
    },
    init: function()
    {
        sap.ui.core.UIComponent.prototype.init.apply(this, arguments);
        // this component should automatically initialize the router!
        this.getRouter().initialize();
    },
    createContent: function()
    {
        var panel = new sap.ui.commons.ResponsiveContainer("emptyElement");
        return panel;
    }
});

index.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script id="sap-ui-bootstrap"
            src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
            data-sap-ui-theme="sap_bluecrystal"
            data-sap-ui-libs="sap.ui.commons,sap.m"></script>
    <script>
        jQuery.sap.registerModulePath("cag.sbx", "./components/sbx");
        new sap.ui.core.ComponentContainer({
                name: 'cag.sbx'
            }).placeAt("content");
    </script>
</head>
<body>
    <div id="content"></div>
</body>
</html>

我已经创建了一个包含完整项目和 JSFiddle 的 GitHub 存储库。在 JSFiddle 中，如果使用浏览器开发工具，您会注意到没有对 Products.View.js 或 Login.View.js 文件的 HTTP 请求。

https://github.com/peder/openui5-simplerouting/

http://jsfiddle.net/nbjvqL96/1/

Answer 1

你实际上错过了两件事：

基本容器需要包含 sap.m.App 或 SplitApp 以便可以聚合页面。
targetAggregation 是这些创建的页面将放置在 targetControl 聚合中的位置。在 App 的情况下它是 pages 而对于 splitapp 它可以是 masterPages 或 detailPages

我在 http://jsfiddle.net/nbjvqL96/2/

有更新的代码

OpenUI5 路由喜欢 ASP.NET MVC？

OpenUI5 Routing Like ASP.NET MVC?

model-view-controller

sapui5

Component.js

index.html