SAPUI5 Web应用程序无法正常运行

时间:2017-10-31 12:36:29

标签: eclipse sapui5 sapui5-theming

我正在尝试制作一个hello world web全屏应用程序。所以,我创建了一个名为Hello world的新项目。然后,我创建了一个名为WebContent的文件夹。在其中,我将以下代码放在index.html中,如下所示。

WebContent / index.html

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>

        <script src="resources/sap-ui-core.js"
                id="sap-ui-bootstrap"
                data-sap-ui-libs="sap.m"
                data-sap-ui-theme="sap_bluecrystal"
                data-sap-ui-resourceroots='{"com.Project":""}'>
        </script>
        <!-- only load the mobile lib "sap.m" and the "sap_bluecrystal" theme -->

        <script>
        var app = new sap.m.App({initialPage:"idpage1"});
        var page1 = sap.ui.view({id:"idpage1", viewName:"com.Project.HelloWorld.Page1", type:sap.ui.core.mvc.ViewType.XML});

        app.addPage(Page1);
        app.placeAt("content");

        </script>

    </head>
    <body class="sapUiBody" role="application">
        <div id="content"></div>
    </body>
</html>

然后,在这个目录WebContent/ HelloWorld中,我放了一个名为Page1.controller.js的文件,其中包含以下代码

WebContent / HelloWorld / Page1.controller.js

sap.ui.define([
   "sap/ui/core/mvc/Controller"
], function(Controller) {
   "use strict";        
    return Controller.extend("com.Project.HellowWorld.Page1", {         
    });
});

另外,我创建了另一个文件

WebContent / HelloWorld / Page1.view.xml

<!DOCTYPE xml>

<core:View xmlns:core="sap.ui.core" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m"
        controllerName="com.Project.HellowWorld.Page1" xmlns:html="http://www.w3.org/1999/xhtml">
    <Page title="Full screen App">
        <content>                 
        </content>           
     </Page>
</core:View>

问题在于背景出现。但是,整个内容不会按要求显示在页面上。

顺便说一句,我正在学习这门课程 SAPUI5 - Split Application

在6:30,应用程序完美运行,与我的应用程序不同。

更新+解决方案:

我只知道解决问题的方法。 1-在index.html:20我的代码的这一部分写得像app.addPage(Page1);所以,我只是用app.addPage(page1);替换它,错误就消失了。

2-另一个错误出现在XML文件中。我刚刚用<core:View>....</core:View>

替换了<core:view>....</core:view>

现在,应用程序运行正常。

2 个答案:

答案 0 :(得分:1)

您的<page>写成小写。它应该是<Page>

您应该在控制台中收到以下错误: Uncaught Error: failed to load 'sap/m/page.js' from .../resources/sap/m/page.js: 404 - Not Found

答案 1 :(得分:0)

解决方案:

我只知道解决问题的方法。 1- index.html:20我的代码的这一部分写得像app.addPage(Page1);所以,我只是用app.addPage(page1);替换它,错误就消失了。

2-另一个错误出现在XML文件中。我刚刚用<core:View>....</core:View>

替换了<core:view>....</core:view>

现在,应用程序运行正常。