XML-Views funktionieren leider nicht
Hallo zusammen,
ich wäre gerade dabei eine App zu erstellen. Leider ist es hierbei so, dass sich XML-Views nicht anzeigen lassen. Wenn ich beispielsweise nur eine Textausgabe programmieren, ist alles gut und wird auf dem Browser ausgegeben.
Bloß sobald ich versuche XML-Views mit VS-Code zu programmieren, erscheint auf meinem Browser nichts (Siehe Bild im Anhang). Habe bereits mehrere Browser versucht, überall das gleiche Problem.
Habe auch schon die Probeversion aus dem Internet heruntergeladen, auch hier wird nichts angezeigt.
Hatte schon mal jemand das Problem oder weiß wie man das löst?
Vielen Dank im Voraus.
ich wäre gerade dabei eine App zu erstellen. Leider ist es hierbei so, dass sich XML-Views nicht anzeigen lassen. Wenn ich beispielsweise nur eine Textausgabe programmieren, ist alles gut und wird auf dem Browser ausgegeben.
Bloß sobald ich versuche XML-Views mit VS-Code zu programmieren, erscheint auf meinem Browser nichts (Siehe Bild im Anhang). Habe bereits mehrere Browser versucht, überall das gleiche Problem.
Habe auch schon die Probeversion aus dem Internet heruntergeladen, auch hier wird nichts angezeigt.
Hatte schon mal jemand das Problem oder weiß wie man das löst?
Vielen Dank im Voraus.
Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.
gesponsert ⓘ
Stellenangebote auf ABAPforum.com schalten
kostenfrei für Ausbildungsberufe und Werksstudenten
kostenfrei für Ausbildungsberufe und Werksstudenten
Beitrag
von Lukas Sanders (ForumUser / 70 / 7 /
34
)
»
Hallo,
die in App.view.xml definierte View wird nicht geladen, sondern eine neue leere View erzeugt (ab Zeile 21 in index.html). Du müsstest die View aus der Datei laden, am besten über die manifest.json.
Ein Beispiel ist hier zu finden.
die in App.view.xml definierte View wird nicht geladen, sondern eine neue leere View erzeugt (ab Zeile 21 in index.html). Du müsstest die View aus der Datei laden, am besten über die manifest.json.
Ein Beispiel ist hier zu finden.
Hallo Lukas Sanders,
vielen Dank für deine Antwort.
ich hätte es mal wie in dem Beispiel gemacht. Ich hätte mir sogar mal das ganze Beispiel heruntergeladen und dann ausprobiert. Trotzdem wird bei mir leider nichts angezeigt :/. Wenn ich im Browser die F12 aufrufe, zeigt es mir folgende Fehlermeldung an (Siehe Bild 3 mit Fehlermeldung).
Weißt du vielleicht an was das liegen könnte. Bin mit meinem Latein langsam echt am Ende.
Meine Manifest.json File
Meine Component.js File:
vielen Dank für deine Antwort.
ich hätte es mal wie in dem Beispiel gemacht. Ich hätte mir sogar mal das ganze Beispiel heruntergeladen und dann ausprobiert. Trotzdem wird bei mir leider nichts angezeigt :/. Wenn ich im Browser die F12 aufrufe, zeigt es mir folgende Fehlermeldung an (Siehe Bild 3 mit Fehlermeldung).
Weißt du vielleicht an was das liegen könnte. Bin mit meinem Latein langsam echt am Ende.
Meine Manifest.json File
Code: Alles auswählen.
{
"_version": "1.21.0",
"sap.app": {
"id": "sap.ui.demo.walkthrough",
"type": "application",
"i18n": {
"bundleUrl": "i18n/i18n.properties",
"supportedLocales": [
""
],
"fallbackLocale": ""
},
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"applicationVersion": {
"version": "1.0.0"
}
},
"sap.ui": {
"technology": "UI5",
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
}
},
"sap.ui5": {
"rootView": {
"viewName": "sap.ui.demo.walkthrough.view.App",
"type": "XML",
"id": "app"
},
"dependencies": {
"minUI5Version": "1.98.0",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "sap.ui.demo.walkthrough.i18n.i18n",
"supportedLocales": [
""
],
"fallbackLocale": ""
}
}
}
}
}
Meine Component.js File:
Code: Alles auswählen.
sap.ui.define([
"sap/ui/core/UIComponent",
"sap/ui/model/json/JSONModel"
], function (UIComponent, JSONModel) {
"use strict";
return UIComponent.extend("sap.ui.demo.walkthrough.Component", {
metadata : {
interfaces: ["sap.ui.core.IAsyncContentCreation"],
manifest: "json"
},
init : function () {
// call the init function of the parent
UIComponent.prototype.init.apply(this, arguments);
// set data model
var oData = {
recipient : {
name : "World"
}
};
var oModel = new JSONModel(oData);
this.setModel(oModel);
}
});
});
Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.
sap-ui-core.js stammt von der UI5-Runtime und muss separat von https://tools.hana.ondemand.com/#sapui5 heruntergeladen, entpackt und in das entsprechende resources-Verzeichnis verschoben werden.
Publikationen:
Qualitätsmanagement in der ABAP-Entwicklung,
Why we should take care about clean code
ABAP, Java, JavaScript
GitHub
Qualitätsmanagement in der ABAP-Entwicklung,
Why we should take care about clean code
ABAP, Java, JavaScript
GitHub
Hallo jocoder,
vielen Dank für deine Antwort.
Die Fehlermeldung wäre nun weg. Bloß leider wird trotzdem immer noch nichts angezeigt, sobald ich eine View-Datei erstelle :/.
Wenn ich es so programmiere und alles in die index.html-Datei packe funktioniert es komischerweise:
Hat da vielleicht noch jemand eine Idee ?
Was müsste man in der manifest.json-Datei angeben, dass es die View ziehen würde?
Vielen Dank im Voraus.
vielen Dank für deine Antwort.
Die Fehlermeldung wäre nun weg. Bloß leider wird trotzdem immer noch nichts angezeigt, sobald ich eine View-Datei erstelle :/.
Wenn ich es so programmiere und alles in die index.html-Datei packe funktioniert es komischerweise:
Code: Alles auswählen.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta charset="UTF-8">
<title>List example</title>
<script id="sap-ui-bootstrap"
type="text/javascript"
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"
data-sap-ui-xx-bindingSyntax="complex">
</script>
<!-- XML-based view definition mode="SingleSelectMaster" -->
<script id="view1" type="sapui5/xmlview">
<mvc:View controllerName="ui5_wt_confirm.controller.Login" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc">
<App>
<Page title="{i18n>helloPanelTitle}">
<subHeader>
<Toolbar>
</Toolbar>
</subHeader>
<content>
<Button text="Hello" press="onShowHello" class="myCustomButton"/>
<Input value="Dummy" valueLiveUpdate="true" width="60%"/>
<Text text="Hello Dummy" class="sapUiSmallMargin sapThemeHighlight-asColor myCustomText"/>
</content>
<footer>
<Toolbar>
<ToolbarSpacer/>
<Button text="Login" type="Accept" press="onLogin"/>
<Button text="Exit" type="Reject"/>
</Toolbar>
</footer>
</Page>
</App>
</mvc:View>
</script>
<script>
// Controller definition
sap.ui.controller("ui5_wt_confirm.controller.Login", {
onInit: function() {
}
});
// Instantiate the View, assign a model
// and display
var oView = sap.ui.xmlview({
viewContent: jQuery('#view1').html()
});
oView.placeAt('content');
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
Was müsste man in der manifest.json-Datei angeben, dass es die View ziehen würde?
Vielen Dank im Voraus.
Beitrag
von Lukas Sanders (ForumUser / 70 / 7 /
34
)
»
Hallo,
der Namensraum könnte vielleicht das Problem sein. In der mindex.html im ersten Beitrag steht
Mit dieser Zeile wird für das Framework festgelegt, dass alles, was mit "sap.ui.demo.walkthrough.04.webapp" sich im gleichen Ordner ("./") befindet wie die index.html-Datei. Die Angabe "sap.ui.demo.walkthrough.04.webapp.view.App" für eine View würde somit auf die Datei App.view.xml im Unterordner view zeigen.
In der unteren manifest.json steht hier "sap.ui.demo.walkthrough.view.App". Der Namensraum für die App müsste also auf "sap.ui.demo.walkthrough" festgelegt worden sein.
der Namensraum könnte vielleicht das Problem sein. In der mindex.html im ersten Beitrag steht
Code: Alles auswählen.
data-sap-ui-resourceroots='{ "sap.ui.demo.walkthrough.04.webapp": "./" }'In der unteren manifest.json steht hier "sap.ui.demo.walkthrough.view.App". Der Namensraum für die App müsste also auf "sap.ui.demo.walkthrough" festgelegt worden sein.
Hi Lukas Sanders,
hmm leider will es trotzdem nicht :/.
Ich hätte jetzt mal die Datei von deinem Link heruntergeladen und damit versucht.
Leider kommt immer noch nichts:
meine Index.Html-Datei:
Meine Manifest.json-Datei:
Meine package.json-Datei:
Meine ui5.yaml-Datei:
Die restlichen Dateien hätte ich als Bilder beigefügt.
Ich hätte es ganz normal runtergeladen und leider zeigt es trotzdem nichts an :/
Würde das bei dir so funktionieren und angezeigt werden?
Ich habe keine Ahnung was ich noch versuchen soll....
hmm leider will es trotzdem nicht :/.
Ich hätte jetzt mal die Datei von deinem Link heruntergeladen und damit versucht.
Leider kommt immer noch nichts:
meine Index.Html-Datei:
Code: Alles auswählen.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SAPUI5 Walkthrough</title>
<script
id="sap-ui-bootstrap"
src="resources/sap-ui-core.js"
data-sap-ui-theme="sap_horizon"
data-sap-ui-resourceroots='{
"sap.ui.demo.walkthrough": "./"
}'
data-sap-ui-oninit="module:sap/ui/core/ComponentSupport"
data-sap-ui-compatVersion="edge"
data-sap-ui-async="true">
</script>
</head>
<body class="sapUiBody" id="content">
<div data-sap-ui-component data-name="sap.ui.demo.walkthrough" data-id="container"
data-settings='{"id" : "walkthrough"}'></div>
</body>
</html>
Code: Alles auswählen.
{
"_version": "1.21.0",
"sap.app": {
"id": "sap.ui.demo.walkthrough",
"type": "application",
"i18n": {
"bundleUrl": "i18n/i18n.properties",
"supportedLocales": [
""
],
"fallbackLocale": ""
},
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"applicationVersion": {
"version": "1.0.0"
}
},
"sap.ui": {
"technology": "UI5",
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
}
},
"sap.ui5": {
"rootView": {
"viewName": "sap.ui.demo.walkthrough.view.App",
"type": "XML",
"id": "app"
},
"contentDensities": {
"compact": true,
"cozy": true
},
"dependencies": {
"minUI5Version": "1.98.0",
"libs": {
"sap.ui.core": {},
"sap.m": {}
}
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "sap.ui.demo.walkthrough.i18n.i18n",
"supportedLocales": [
""
],
"fallbackLocale": ""
}
}
}
}
}
Code: Alles auswählen.
{
"name": "walkthrough-tutorial",
"private": true,
"version": "1.0.0",
"author": "SAP SE",
"description": "UI5 Demo App - Walkthrough Tutorial",
"scripts": {
"start": "ui5 serve",
"build": "ui5 build"
},
"devDependencies": {
"@ui5/cli": "^3"
}
}
Code: Alles auswählen.
specVersion: '3.0'
metadata:
name: walkthrough-tutorial
type: application
framework:
name: OpenUI5
version: "1.118.0"
libraries:
- name: sap.ui.core
- name: sap.m
- name: themelib_sap_horizon
Ich hätte es ganz normal runtergeladen und leider zeigt es trotzdem nichts an :/
Würde das bei dir so funktionieren und angezeigt werden?
Ich habe keine Ahnung was ich noch versuchen soll....
Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.
Hi zusammen,
könnte mir hier vielleicht irgendjemand einen Gefallen tun?
Könnte vielleicht jemand dieses Beispiel hier herunterladen:
https://sapui5.hana.ondemand.com/sdk/#/ ... a1e2fc7064
und versuchen ob es beim ihm/ihr über Visual Studio Code zu einer Anzeige von dem Hello World kommt?
Ich hätte es nun auch noch mal auf einem anderen PC heruntergeladen und versucht, trotzdem keine Ausgabe nur einen bläulichen Bildschirm. Das ist doch komisch. Was ist denn dort der Fehler? Weiß da jemand weiter?
Vielen Dank im Voraus.
könnte mir hier vielleicht irgendjemand einen Gefallen tun?
Könnte vielleicht jemand dieses Beispiel hier herunterladen:
https://sapui5.hana.ondemand.com/sdk/#/ ... a1e2fc7064
und versuchen ob es beim ihm/ihr über Visual Studio Code zu einer Anzeige von dem Hello World kommt?
Ich hätte es nun auch noch mal auf einem anderen PC heruntergeladen und versucht, trotzdem keine Ausgabe nur einen bläulichen Bildschirm. Das ist doch komisch. Was ist denn dort der Fehler? Weiß da jemand weiter?
Vielen Dank im Voraus.
Beitrag
von PeterPaletti (Specialist / 351 / 32 /
97
)
»
Wenn ich es mit Visual Studio Code einfach so probiere, kommt es bei mir nicht zu einer Ausgabe von "Hello World".
Wenn ich aber vorher https://sap.github.io/ui5-tooling/stabl ... ngStarted/ beachte, läuft alles fein.
Sprich: ich habe neben Visual Studio Code auch node.js installiert und UI5 CLI unter node.js installiert, wie im Link beschrieben. Dann bekomme ich "Hello World" auch angezeigt.
Wenn ich aber vorher https://sap.github.io/ui5-tooling/stabl ... ngStarted/ beachte, läuft alles fein.
Sprich: ich habe neben Visual Studio Code auch node.js installiert und UI5 CLI unter node.js installiert, wie im Link beschrieben. Dann bekomme ich "Hello World" auch angezeigt.
Hallo PeterPaletti,
vielen Dank für deine Antwort. Ich hätte Node.js jetzt nochmal installiert. Danach die Datei nochmal heruntergeladen und dann folgende Schritte gemacht:
- npm install --global @ui5/cli
- npm install --save-dev @ui5/cli
- npm init --yes
- ui5 init
- ui5 use openui5@latest
- ui5 add sap.ui.core sap.m sap.ui.table themelib_sap_fiori_3
und dann :
-ui5 build --all
und hier bekomme ich folgende Fehlermeldung (Siehe Bilder im Anhang). Ich glaube daran liegt es irgendwie. Ich bekomme einen Fehler wegen dem SAP XML Annotation Server. Weiß jemand was da das Problem sein könnte und wie man das löst?
Es würde das HelloWorld nämlich immer noch nicht angezeigt werden, aber ich denke, das wird das Problem sein.
Vielen Dank im VOraus.
vielen Dank für deine Antwort. Ich hätte Node.js jetzt nochmal installiert. Danach die Datei nochmal heruntergeladen und dann folgende Schritte gemacht:
- npm install --global @ui5/cli
- npm install --save-dev @ui5/cli
- npm init --yes
- ui5 init
- ui5 use openui5@latest
- ui5 add sap.ui.core sap.m sap.ui.table themelib_sap_fiori_3
und dann :
-ui5 build --all
und hier bekomme ich folgende Fehlermeldung (Siehe Bilder im Anhang). Ich glaube daran liegt es irgendwie. Ich bekomme einen Fehler wegen dem SAP XML Annotation Server. Weiß jemand was da das Problem sein könnte und wie man das löst?
Es würde das HelloWorld nämlich immer noch nicht angezeigt werden, aber ich denke, das wird das Problem sein.
Vielen Dank im VOraus.
Du hast keine ausreichende Berechtigung, um die Dateianhänge dieses Beitrags anzusehen.
Hallo PeterPaletti,
den Fehler mit der XML Annotation Server habe ich nun wegbekommen. Leider funktioniert es trotzdem immer noch nicht :/.
könntest du mir vielleicht bitte deinen Code posten? Dann würde ich es damit mal probieren. Oder hätte mir jemand anderes seinen Code der funktioniert. Ich versuche gerade die Fehlerquellen auszuschließen.
Vielen Dank im Voraus.
den Fehler mit der XML Annotation Server habe ich nun wegbekommen. Leider funktioniert es trotzdem immer noch nicht :/.
könntest du mir vielleicht bitte deinen Code posten? Dann würde ich es damit mal probieren. Oder hätte mir jemand anderes seinen Code der funktioniert. Ich versuche gerade die Fehlerquellen auszuschließen.
Vielen Dank im Voraus.
Beitrag
von PeterPaletti (Specialist / 351 / 32 /
97
)
»
Hallo,
ich habe nichts anderes gemacht als die Dateien da https://sapui5.hana.ondemand.com/sdk/#/ ... through.04 herunterzuladen sowie UI5 CLI unter node.js zu installieren. Und dann habe ich die index.html in Visual Studio Code ausgeführt. Voila.
ich habe nichts anderes gemacht als die Dateien da https://sapui5.hana.ondemand.com/sdk/#/ ... through.04 herunterzuladen sowie UI5 CLI unter node.js zu installieren. Und dann habe ich die index.html in Visual Studio Code ausgeführt. Voila.
Hallo PeterPaletti,
ich hätte es jetzt auch nochmal heruntergeladen und danach hast du nur "npm install --global @ui5/cli" im Terminal ausgeführt, oder? Oder hast du sonst noch was ausgeführt?
Und dann hättest du diese Version hier heruntergeladen (Siehe Bild) und noch installiert und fertig, oder?
Vielen Dank im Voraus.
ich hätte es jetzt auch nochmal heruntergeladen und danach hast du nur "npm install --global @ui5/cli" im Terminal ausgeführt, oder? Oder hast du sonst noch was ausgeführt?
Und dann hättest du diese Version hier heruntergeladen (Siehe Bild) und noch installiert und fertig, oder?
Vielen Dank im Voraus.
Beitrag
von PeterPaletti (Specialist / 351 / 32 /
97
)
»
Ich habe mir die Dateien aus dem Tutorial von SAP heruntergeladen und die HTML-Datei unter VS Code ausgeführt. -> Kein Ergebnis
Dann habe ich im Terminal UI5/CLI unter node.js installiert mit den Befehlen
- npm install --global @ui5/cli
- npm install --save-dev @ui5/cli
Danach habe ich nochmal die HTML-Datei in VS Code ausgeführt -> Text "Hello World" erscheint.
Dann habe ich im Terminal UI5/CLI unter node.js installiert mit den Befehlen
- npm install --global @ui5/cli
- npm install --save-dev @ui5/cli
Danach habe ich nochmal die HTML-Datei in VS Code ausgeführt -> Text "Hello World" erscheint.
Vergleichbare Themen
9
Antw.
Antw.
2506
Views
Views
1
Antw.
Antw.
2323
Views
Views
6
Antw.
Antw.
3012
Views
Views
OO-ALV: Standardfunktionen funktionieren nicht
von Gast » 11.01.2006 08:58 • Verfasst in ABAP Objects®
von Gast » 11.01.2006 08:58 • Verfasst in ABAP Objects®
4
Antw.
Antw.
4528
Views
Views
Funktionstasten für GUI Status funktionieren nicht
von yuro » 15.01.2015 11:02 • Verfasst in ABAP Objects®
von yuro » 15.01.2015 11:02 • Verfasst in ABAP Objects®
0
Antw.
Antw.
968
Views
Views
SAPGui-Animationen funktionieren nicht mehr
von DeathAndPain » 25.09.2018 11:45 • Verfasst in ABAP® für Anfänger
von DeathAndPain » 25.09.2018 11:45 • Verfasst in ABAP® für Anfänger
Frage die ABAP Experten
Über diesen Beitrag
Unterstütze die Community und teile den Beitrag für mehr Leser und Austausch
Aktuelle Forenbeiträge
Newsletter Anmeldung
Keine Beiträge verpassen! Wöchentlich versenden wir lesenwerte Beiträge aus unserer Community.Die letzte Ausgabe findest du hier.
Aktuelle Forenbeiträge
Unbeantwortete Forenbeiträge
Zeitnachweis in HRFORMS: Wo werden die Texte gesetzt für Tageseinzelergebnisse?
vor 4 Wochen von mazu 1 / 2938
vor 4 Wochen von mazu 1 / 2938