Warm tip: This article is reproduced from serverfault.com, please click

其他-SAPUI5:sap.f.card存在多个为基数为0..1的聚合定义的聚合

(其他 - SAPUI5: Issue with sap.f.card multiple aggregates defined for aggregation with cardinality 0..1)

发布于 2020-12-11 05:59:30

我需要在我的UI5应用程序之一中创建概述页面(https://sapui5.hana.ondemand.com/#/topic/c64ef8c6c65d4effbfd512e9c9aa5044)。在浏览时,我发现概述页面由动态页面和Cards控件(https://experience.sap.com/fiori-design-web/overview-page/)组成。因此,我开始使用这些控件进行开发,并遇到了一种奇怪的情况。

当我用1张卡运行以下代码时,它起作用了。我可以看到卡上有一些数据。

<mvc:View
controllerName="xx.view.controller.Overview"
xmlns="sap.m"
xmlns:mvc="sap.ui.core.mvc"
xmlns:semantic="sap.m.semantic"
xmlns:commons="sap.suite.ui.commons"
xmlns:core="sap.ui.core"
xmlns:f="sap.f"
xmlns:card="sap.f.cards"
xmlns:form="sap.ui.layout.form"
xmlns:l="sap.ui.layout"
xmlns:table="sap.ui.table">

<f:DynamicPage
    toggleHeaderOnTitleClick="false"
    class="sapUiNoContentPadding">
    <f:title>
        <f:DynamicPageTitle>
            <f:heading>
                <Title text="{i18n>title.page}"/>
            </f:heading>
            <f:actions>
                <OverflowToolbarButton
                    id="idRefreshBtn"
                    type="Transparent"
                    icon="sap-icon://refresh"
                    press="handleRefresh"
                    tooltip="{i18n>tooltip.refresh}" />
                <OverflowToolbarButton
                    id="idFullScreenBtn"
                    type="Transparent"
                    icon="sap-icon://full-screen"
                    press="handleFullScreen"
                    tooltip="{i18n>tooltip.fullScreen}" />
                <OverflowToolbarButton
                    id="idExitFullScreenBtn"
                    type="Transparent"
                    icon="sap-icon://exit-full-screen"
                    press="handleExitFullScreen"
                    tooltip="{i18n>tooltip.exitFullScreen}" />
                <OverflowToolbarButton
                    id="idCloseScreenBtn"
                    type="Transparent"
                    icon="sap-icon://decline"
                    press="handleCloseScreen"
                    tooltip="{i18n>tooltip.exitFullScreen}" />
            </f:actions>
        </f:DynamicPageTitle>
    </f:title>

    <f:content>
        <f:Card class="sapUiTinyMargin" width="300px">
            <f:header>
                <card:Header
                    title="{i18n>lbl.MyFavourites}" />
            </f:header>
            <f:content>
                <List
                    growing="true"
                    growingThreshold="100"
                    growingScrollToLoad="false"
                    items="{baseModel>/aFavouritesList}">
                    <items>
                        <CustomListItem type="Navigation" press="fnNavDetails">
                            <HBox>
                                <core:Icon
                                    src="{
                                        path: 'baseModel>Type',
                                        formatter: '.formatter.formatProcessIcons'
                                    }"
                                    class="sapUiSmallMarginBegin sapUiSmallMarginTopBottom"/>
                                <Text
                                    text="{baseModel>Description}"
                                    class="sapUiSmallMarginBegin sapUiSmallMarginTopBottom" />
                            </HBox>
                        </CustomListItem>
                    </items>
                </List>
            </f:content>
        </f:Card>
    </f:content>
</f:DynamicPage>
</mvc:View>

我得到了结果

在此处输入图片说明

但是,当我运行下面的代码时,我看到了奇怪的卡表示形式。我只看到一张卡,而不是两张卡。在控制台中,我得到以下消息。

为基数为0..1的聚合定义了多个聚合

我从SAPUI5浏览的网页(https://sapui5.hana.ondemand.com/#/entity/sap.f.Card/sample/sap.f.sample.Card/code)中获取了示例,以查看没有2个图块时的外观考虑数据。

<f:Card class="sapUiMediumMargin" width="300px">
            <f:header>
                <card:Header
                    title="Buy bus ticket on-line"
                    subtitle="Buy a single-ride ticket for a date"
                    iconSrc="sap-icon://bus-public-transport" />
            </f:header>
            <f:content>
                <VBox
                    height="110px"
                    class="sapUiSmallMargin"
                    justifyContent="SpaceBetween">
                    <HBox justifyContent="SpaceBetween">
                        <ComboBox
                            width="120px"
                            placeholder="From City"
                            items="{
                                path: 'cities>/cities',
                                sorter: { path: 'text' }
                            }">
                            <core:Item key="{cities>key}" text="{cities>text}" />
                        </ComboBox>
                        <ComboBox
                            width="120px"
                            placeholder="To City"
                            items="{
                                path: 'cities>/cities',
                                sorter: { path: 'text' }
                            }">
                            <core:Item key="{cities>key}" text="{cities>text}" />
                        </ComboBox>
                    </HBox>
                    <HBox renderType="Bare" justifyContent="SpaceBetween">
                        <DatePicker width="200px" placeholder="Choose Date ..." />
                        <Button
                            text="Book"
                            press=".onBookPress"
                            type="Emphasized"
                            class="sapUiTinyMarginBegin" />
                    </HBox>
                </VBox>
            </f:content>
        </f:Card>

        <f:Card class="sapUiMediumMargin" width="300px">
            <f:header>
                <card:Header title="Project Cloud Transformation" subtitle="Revenue per Product | EUR" />
            </f:header>
            <f:content>
                <List
                    showSeparators="None"
                    items="{
                        path: 'products>/productItems'
                    }">
                    <CustomListItem>
                        <HBox alignItems="Center" justifyContent="SpaceBetween">
                            <VBox class="sapUiSmallMarginBegin sapUiSmallMarginTopBottom" >
                                <Title level="H3" text="{products>title}" />
                                <Text text="{products>subtitle}" />
                            </VBox>
                            <ObjectStatus
                                class="sapUiTinyMargin sapUiSmallMarginEnd"
                                text="{products>revenue}"
                                state="{products>statusSchema}" />
                        </HBox>
                    </CustomListItem>
                </List>
            </f:content>
        </f:Card>

在此处输入图片说明

知道我在做什么错吗?请帮助。

Questioner
Prashob Thekkyal
Viewed
0
A.vH 2020-12-11 15:59:34

sap.f.DynamicPagecontent-Aggregation仅允许0..1控件。你想将2张卡添加到它导致错误。

只需将2张卡包装在中<HBox justifyContent="SpaceBetween">,它就可以正常工作。