2

所以，我有这个 UI5 应用程序，它在通过 index.html 调用时工作得非常好，但是当我尝试将它称为组件时它会中断（找不到资源、加载失败、404 错误等）。两个应用程序（呼叫者和被呼叫者）都在网关上

这是应用程序文件夹结构。callee_app-Struct.jpg 

link to GitHub - https://github.com/mailsandip/component_test

所有视图都在 zui5_trip_confirmation -> views 文件夹下。图像和模型在各自的文件夹中。

component.js 位于 Component 文件夹下，定义为

// define a new UIComponent  
jQuery.sap.declare("components.Component");  
jQuery.sap.require("sap.ui.core.UIComponent");  
jQuery.sap.require("sap.ui.commons.Button");  
jQuery.sap.require("sap.ui.table.Table");  
//new Component  
sap.ui.core.UIComponent.extend("components.Component", {  
    metadata : {  
        properties : {  
            text: "string"  
        }  
    }  
});  
components.Component.prototype.createContent = function(){  
/* trying to register the path zui5_trip_confirmation where all the views are stored */  
sap.ui.localResources("zui5_trip_confirmation");  
// jQuery.sap.registerModulePath('zui5_trip_confirmation','/sap/bc/ui5_ui5/sap/zui5_trip_conf/zui5_trip_confirmation');  
    this.oView = sap.ui.jsview("idHome", "zui5_trip_confirmation.views.Home");  
     return this.oView;   
};

调用者应用程序将其称为

jQuery.sap.registerModulePath('components','/sap/bc/ui5_ui5/sap/zui5_trip_conf/components');
var oComp1 = sap.ui.getCore().createComponent({
        name: "components",
        id: "Comp1",
        settings: {text: "Hello World"}
    });

    var oCompCont1 = new sap.ui.core.ComponentContainer("CompCont1", {
        component: oComp1
    });
    oCompCont1.placeAt("content");

当我运行调用者应用程序时，控制台上出现资源未找到错误。基本上，组件无法解析视图/模型/图像的路径。

这里有什么问题？

问候桑迪普

4

2 回答 2

1

和

jQuery.sap.registerModulePath('components','/sap/bc/ui5_ui5/sap/zui5_trip_conf/components')

您告诉核心在“/sap/bc/[...]”中查找以“组件”开头的所有内容。

然后你说组件名称是“组件”。那不应该是“components.Component”吗？

好的，更新示例：

（我希望这能让它更清楚）

最重要的部分：我们注册组件文件所在文件夹的路径并为其分配前缀。在组件内部，我们启动每一个对象/元素/控件/等。具有与组件相同的前缀。（在您的情况下：“zui5_conf_try”）。

我在我的服务器上创建了示例：http: //dev.himmelrath.net/ui5/so_componentExample/您可以在此处下载所有文件：http: //dev.himmelrath.net/ui5/so_componentExample.zip

在组件之外，在 index.html 中创建 ComponentContainer 时，我们通过注册其前缀来注册所有组件部分的路径。

索引.html：

<!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.ui.commons"
        data-sap-ui-theme="sap_goldreflection">
</script>
<script>

// The following line tells the core to look for everything that starts with
// "zui5_conf_try." in the (relative to this html-file's URL) folder "zui5_conf_try"
// This should be equivalent to:
//     jQuery.sap.registerModulePath("zui5_conf_try", "./zui5_conf_try")
sap.ui.localResources("zui5_conf_try")

// Let's skip the component instantiation, ComponentContainer can do that for us
// when we gie it the name of our component.
var oCompCont1 = new sap.ui.core.ComponentContainer("CompCont1", {
    name: "zui5_conf_try",
});

oCompCont1.placeAt("content");

</script>

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

zui5_conf_try/Components.js：

// define a new UIComponent
jQuery.sap.declare("zui5_conf_try.Component");

//jQuery.sap.require("sap.ui.core.Core");
jQuery.sap.require("sap.ui.core.UIComponent");
jQuery.sap.require("sap.ui.commons.Button");
jQuery.sap.require("sap.ui.table.Table");

//new Component
sap.ui.core.UIComponent.extend('zui5_conf_try.Component',{  
    metadata : {
        version : "1.0",
    },  

    // DO NOT overwrite the components init method - it is used internally
    // and calls the createContent-method
    /*
    init: function() {
        alert('init222');       
    },
    */

    createContent: function() {
        // Using sap.ui.localResources('views'); in this context would still 
        // register the path relative to our index.html, not the Component.js
        // so we do not use it. Instead we use the same prefix as the component
        // for our views, because we know that that path must be set correctly
        // if this file has been loaded.

        // This should look for "./views/Home.view.js" relative to the components
        // path, since the components path was registered in the index.html ouside
        // the component
        var view = sap.ui.jsview("idHome", "zui5_conf_try.views.Home");
        return view;
    }
});

zui5_conf_try/views/Home.view.js：

sap.ui.jsview("zui5_conf_try.views.Home", {  

   getControllerName: function() {
      return "zui5_conf_try.views.Home";     
   },

   createContent: function(oController) {
      var oButton = new sap.ui.commons.Button({text:"I am zui5_conf_try.views.Home"});
      oButton.attachPress(oController.handleButtonClicked);
      return oButton;
   }

});

zui5_conf_try/views/Home.controller.js：

sap.ui.controller("zui5_conf_try.views.Home", {
   handleButtonClicked : function() {
        alert("You just clicked the view button...");
   }
});
于 2014-02-28T17:04:12.360 回答
0

好的，所以再看一下 - 看起来资源没有被 Component.js 加载，即使提到了显式加载

--inside component.js ----

sap.ui.localResources('views');
sap.ui.resources('images');

  var view = sap.ui.jsview("idHome", "views.Home");
  return view;

---- exit ----

这让我感到困惑，核心应该已经加载了相对于 Component.js 位置的视图。图片文件夹也会出现同样的问题。

This seems like an issue with the Component framework.

问候桑迪普

于 2014-02-28T21:01:50.140 回答