javascript - 表头在 UI5 应用程序中不可见

标签 javascript model sapui5

我创建了一个表格,但标题未显示。在我的组件中,我正在读取 OData 实体并将其存储在 JSON 模型中。然后使用此 JSON 模型绑定(bind)标题列文本。

我已附上表格输出图像以供引用:

enter image description here

标题 View .xml:

<mvc:View controllerName="NPAWRMA.controller.header" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc"
    displayBlock="true" xmlns="sap.m" xmlns:l="sap.ui.layout">
    <App id="idAppControl">
        <pages>
            <Page title="NPAW RMA Report">
                <content>
                    <l:VerticalLayout>
                        <Table id="table" growing="true" items="{odata>/RmaPercRevColSet}">
                            <columns>
                                <Column>
                                    <Text text="CBU" id="CbuShortNameColumnTitle"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label01}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label02}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label03}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label04}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label05}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label06}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label07}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label08}"/>
                                </Column>
                            </columns>
                            <items>
                                <ColumnListItem type="Active" press="onPress">
                                    <cells>
                                        <Text text="{odata>CbuShortName}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc01', formatter: '.formatter.numberUnit' }"  state="{State01}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc02', formatter: '.formatter.numberUnit' }"  state="{State02}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc03', formatter: '.formatter.numberUnit' }"  state="{State03}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc04', formatter: '.formatter.numberUnit' }"  state="{State04}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc05', formatter: '.formatter.numberUnit' }"  state="{State05}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc06', formatter: '.formatter.numberUnit' }"  state="{State06}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc07', formatter: '.formatter.numberUnit' }"  state="{State07}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc08', formatter: '.formatter.numberUnit' }"  state="{State08}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc09', formatter: '.formatter.numberUnit' }"  state="{State09}"/>
                                    </cells>
                                </ColumnListItem>
                            </items>
                        </Table>
                        <Table id="table1" growing="true" items="{odata>/RmaPercRevColSet}">
                            <columns>
                                <Column>
                                    <Text text="CBU" id="CbuShortNameColumnTitle1"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label01}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label02}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label03}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label04}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label05}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label06}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label07}"/>
                                </Column>
                                <Column>
                                    <Text text="{Labels>/Labels1/Label08}"/>
                                </Column>
                            </columns>
                            <items>
                                <ColumnListItem type="Active" press="onPress">
                                    <cells>
                                        <Text text="{odata>CbuShortName}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc01', formatter: '.formatter.numberUnit' }" unit="%" state="{State01}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc02', formatter: '.formatter.numberUnit' }" unit="%" state="{State02}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc03', formatter: '.formatter.numberUnit' }" unit="%" state="{State03}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc04', formatter: '.formatter.numberUnit' }" unit="%" state="{State04}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc05', formatter: '.formatter.numberUnit' }" unit="%" state="{State05}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc06', formatter: '.formatter.numberUnit' }" unit="%" state="{State06}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc07', formatter: '.formatter.numberUnit' }" unit="%" state="{State07}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc08', formatter: '.formatter.numberUnit' }" unit="%" state="{State08}"/>
                                        <ObjectNumber number="{ path: 'odata>NpiPerc09', formatter: '.formatter.numberUnit' }" unit="%" state="{State09}"/>
                                    </cells>
                                </ColumnListItem>
                            </items>
                        </Table>
                    </l:VerticalLayout>
                </content>
            </Page>
        </pages>
    </App>
</mvc:View>

组件.js:

sap.ui.define([
	"sap/ui/core/UIComponent",
	"sap/ui/Device",
	"NPAWRMA/model/models"
], function(UIComponent, Device, models) {
	"use strict";

	return UIComponent.extend("NPAWRMA.Component", {

		metadata: {
			manifest: "json"
		},

		/**
		 * The component is initialized by UI5 automatically during the startup of the app and calls the init method once.
		 * @public
		 * @override
		 */
		init: function() {
			//"Access-Control-Allow-Origin: *.local.com";
			//"Access-Control-Allow-Headers: X-KEY";
			UIComponent.prototype.init.apply(this, arguments);
				debugger;
			var sModel = this.getModel("odata");
			sModel.setSizeLimit(999);
			var oJson1 = new sap.ui.model.json.JSONModel();
			sModel.read("/Labels1Set('0')", {
				success: function(oss) {
					oJson1.setData({
						Label: oss
					});
				},
				error: function(oss) {}
			});
			this.setModel(oJson1, "Labels");
			            
 			// enable routing
			this.getRouter().initialize();
			// set the device model
			this.setModel(models.createDeviceModel(), "device");
		}
	});
});

最佳答案

在您的屏幕截图中,实际上显示了表格标题。第一个列标题(静态绑定(bind))已正确呈现。

annotated table screenshot

所以问题似乎在于绑定(bind)路径或模型内容本身。 我不完全确定您在 sModel.read("/Labels1Set('0')", ...) 成功回调中获得了什么,因为它完全取决于您如何定义 OData 模型。您应该检查是否确实具有所有这些 Label01Label08 属性。

我可以发现的另一件事是,您实际上是在 /Label 绑定(bind)路径中设置结果,但随后您使用的是 /Labels1/LabelXX 绑定(bind)路径(即路径以 Labels1 开头,而不仅仅是 Label)。要解决此问题,您应该调整读取调用的成功回调:

success: function(oss) {
    oJson1.setData({
        Labels1: oss
    });
}

或者,也许更具可读性的是只执行 oJson1.setData(oss),然后简单地从绑定(bind)路径中删除 /Labels1 前缀。

关于javascript - 表头在 UI5 应用程序中不可见,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49842482/

相关文章:

extjs - 如何创建向 Controller 注册的模型的新实例?

xml - SAPUI5:没有在 XML View 中创建动态过滤器的选项?

javascript - SAPUI5 OData - 如何创建与现有实体关联的新条目?

javascript - google maps api在按钮点击时加载 map

javascript - '$ ("#elementId").change( )' is not working and ' $(document).on ("change" "elementId")' 正在工作

Django model_to_dict 在转换模型时跳过所有 DateTimeField

database - 多属性模型EAV数据库设计(其他模型)

sapui5 - 如何做成长表/列表

javascript - 使用Java编写HTML声音?

javascript - 检查单选按钮值并附加 div