SAPUI5使用XML-File作为View with“data-sap-ui-resourceroots”?

问题描述 投票:2回答:1

我正在进行SAPUI5演练并坚持到第4步.(Walkthrough Step 4)

我正在使用Eclipse,并且不知道如何更改此代码行,因此它适用于我的项目并且将找到我的视图。

         data-sap-ui-resourceroots='{
        "sap.ui.demo.wt": "./"
     }' 

我需要知道在使用Eclipse项目时要为“sap.ui.demo.wt”插入什么。

谢谢你的任何提示:)

编辑:

现在我有一个带有按钮的工作页面,触发弹出窗口。

文件夹结构:

SAPUI5_Test
 - WebContent
    - controller
       -> NewView.controller.js
    - view
       -> NewView.view.xml
    - index.html

index.html的:

    <!DOCTYPE html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta charset="UTF-8">
    <title>SAPUI5 Walkthrough</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.m"
        data-sap-ui-compatVersion="edge"
        data-sap-ui-preload="async"
        data-sap-ui-resourceroots='{
            "SAPUI5_Test": "./"
        }'>
    </script>
    <script>
        sap.ui.getCore().attachInit(function () {
            sap.ui.xmlview({
                viewName: "SAPUI5_Test.view.NewView"
            }).placeAt("content");
        });
    </script>
</head>
<body class="sapUiBody" id="content">
</body>
</html>

NewView.view.xml:

<mvc:View
controllerName="SAPUI5_Test.controller.NewView"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc">
<Button 
text="Say hello"
press="onShowHello"/>
</mvc:View>

NewView.controller.js

sap.ui.controller("SAPUI5_Test.controller.NewView", {
    onShowHello : function() {
        alert("Hello SAPUI5_Controller");
    }
});

谢谢你的帮助!也许这可以帮助将来的人:)

xml eclipse view sapui5
1个回答
5
投票

SAPUI5正在按其全名搜索视图,控制器或其他类等资源。

假设每个命名空间部分都是一个文件夹,类/视图名称是文件名。如果是视图,则文件名必须是xxx.view.xml。如果它是一个控制器,文件名必须是xxx.controller.js。

它开始搜索的根文件夹默认是sap-ui-core.js的文件夹。

您可以通过定义data-sap-ui-resourceroots映射来更改根文件夹。它是一个将命名空间映射到路径(相对于index.html)的javascript对象。

使用以下引导标记company.myProject.view.View1/resources/company/myProject/view/View1.view.xml中搜索:

<script id="sap-ui-bootstrap" 
    src="resources/sap-ui-core.js"></script>

使用此引导标记company.myProject.View1/view/View1.view.xml中搜索:

<script id="sap-ui-bootstrap" 
    src="resources/sap-ui-core.js"
    data-sap-ui-resourceroots='{
      "company.myProject": "./" }'></script>

company.myProject.View1上搜索qstxswpoi这个bootstrap标签:

ddd/myProject/view/View1.view.xml

编辑:请注意你必须在地图内使用<script id="sap-ui-bootstrap" src="resources/sap-ui-core.js" data-sap-ui-resourceroots='{ "company": "./ddd" }'></script> "不会工作。


编辑:澄清文件夹结构

我建议您将所有内容放在项目命名空间中。使用此文件夹结构:

'
  • 重命名View文件夹进行查看(按照惯例命名空间为camelCase)。
  • 将newView.view.xml重命名为NewView.view.xml(按类型,类/视图为PascalCase)
  • 使用WebContent - controller - NewView.controller.js - view - NewView.view.xml - index.html
  • 将您的控制器名称更改为myproject.controller.NewView:data-sap-ui-resourceroots='{ "myproject": "./" }'Controller.extend("myproject.controller.NewView", {...});
  • 在xmlview中使用sap.ui.controller("myproject.controller.NewView",{...});
  • 使用controllerName="myproject.controller.NewView"实例化视图。

这样您就不必为项目中的每个子文件夹添加映射。

© www.soinside.com 2019 - 2024. All rights reserved.