Question

我需要在我的应用程序中使用Here Maps Javascript API库。当我独立运行应用程序时它很好用（因为我将它包含在index.html中）。但是当我在HANA Cloud Platform上部署它并尝试在HCP门户站点内运行它时，它会失败。我知道我需要在 Component.js 中加载库文件，因为不使用index.html。我的问题是我需要在开始绘制地图之前加载4个不同的js文件和一个样式表。我正在使用jQuery.sap.includeScript()和jQuery.sap.includeStyleSheet()函数来执行此操作，但在加载库文件之前调用了我的rootview的onInit和onAfterRendering（）（请参阅chrome中的Networks标签中的状态为“pending”）。

我按照以下帖子：

UsingjQuery.sap.includeScript().then() in HCP Firori Launchpad

如何在加载库文件后加载/初始化视图。

在component.js中完成所有这些是否正确。 manifest.json是否在实现这一目标方面发挥了作用。

任何例子都会有所帮助。在此先感谢。

我的组件初始化代码如下：

init: function() {
            // call the base component's init function
            UIComponent.prototype.init.apply(this, arguments);
            var that = this;
            //Load the here maps library
            jQuery.sap.includeScript("https://js.api.here.com/v3/3.0/mapsjs-core.js", "hereMapsCore", $.proxy(function(succ) {
                jQuery.sap.includeScript("https://js.api.here.com/v3/3.0/mapsjs-service.js", "hereMapsService", $.proxy(function(succ) {
                    jQuery.sap.includeScript("https://js.api.here.com/v3/3.0/mapsjs-ui.js", "hereMapsUi", $.proxy(function(succ) {
                        jQuery.sap.includeScript("https://js.api.here.com/v3/3.0/mapsjs-mapevents.js", "heremapsEvent", $.proxy(function(succ) {
                            jQuery.sap.includeStyleSheet("https://js.api.here.com/v3/3.0/mapsjs-ui.css", "hereMapscss", $.proxy(function() {
                                // UIComponent.prototype.init.apply(this, arguments);
                                // set the device model
                                this.setModel(models.createDeviceModel(), "device");
                                var a = this;
                            }, this));
                        }, this), function(oErr) {
                            MessageBox.alert("Map File not loaded");
                        });
                    }, this), function(oErr) {
                        MessageBox.alert("Map File not loaded");
                    });
                }, this), function(oErr) {
                    MessageBox.alert("Map File not loaded");
                });
            }, this), function(oErr) {
                MessageBox.alert("Map File not loaded");
            });
        }

Answer 1

您可以按照表12中Developer Guide中的说明在组件描述符manifest.json中添加所需的资源：

组件中的相对网址，如果已填充则会考虑embeddedBy，指向应用程序所需的js（JavaScript）和css资源，以指定强制{{1}用于CSS的uri（可选）。 JavaScript文件由require机制加载。 CSS文件作为链接标记添加到HTML页面的头部。相对于manifest.json文件的位置，解析了资源。

如果您对绝对URI有疑问，可以将JavaScript和CSS文件存储在组件下方的UI5项目中并使用相对路径。

示例：将其添加到id部分中的manifest.json：

sap.ui5/resources

在SAPUI5中加载第三方库

1 个答案: