sapui5 - "Missing template or factory function for aggregation items of Element"动态绑定(bind)项目时

Question

我正在尝试在 sap.m.Table 中绑定(bind)项目(防止使用工厂函数)，但出现此错误:

Missing template or factory function for aggregation items of Element

我的观点如下:

<Table id="favTable">
  <headerToolbar>
    <Toolbar>
      <Title id="tableHeader" text="{i18n>tableHeader}"/>
    </Toolbar>
  </headerToolbar>
  <columns>
    <Column>
      <Label text="{i18n>serviceNameColText}" />
    </Column>
    <Column>
      <Label text="{i18n>serviceTechNameColText}"/>
    </Column>
    <Column width="50px"/>
  </columns>
  <ColumnListItem>
    <Text text="{Text}" />
    <Text text="{Service}" />
    <Button icon="sap-icon://delete" press="onDeleteRow" />
  </ColumnListItem>
</Table>

根据 Controller 代码(使用绑定(bind)的 OData 服务)尝试在路由被命中后将项目绑定(bind)到 View 中:

_onPatternMatched: function(oEvent) {
  let oTable = this.getView().byId(sIdTable);
  // bind items dynamically with attributes
  const sGroupId = oEvent.getParameter("arguments").Group;
  let sBindingPath = "/DataSet(SetId='" + sSetId + "')"
  oTable.bindItems({
    path: sBindingPath,
    parameters: {
      navigation: {
        FavoriteGroupSet: "ToFavorites"
      }
    },
    filters: [
      // new Filter("InstitutionId", "EQ", oEvent.getParameter("arguments").Institution),
      new Filter("SetId", "EQ", sSetId)
    ]
  })
},

我需要做什么才能进行正确的绑定(bind)以显示正确的数据？

Answer 1

在 UI5 的聚合绑定(bind)概念中，可以使用两种机制来构建聚合项:

模板元素，为模型集合中的每个单独项目克隆。

工厂函数，为模型中的每个单独项目调用，并预计为每次调用构建一个新的控件/元素。

我假设您想使用 ColumnListItem从您的 XML 作为模板。问题是，在构建 XML View 时，只有当您还绑定(bind)了 XML 中的父聚合时，控件才会用作父聚合的模板。否则，它们将被解释为简单的子级。

简而言之，UI5 将您的 View 解释为好像您有一个 sap.m.Table使用单个静态项目。当您尝试绑定(bind) items聚合之后，它会破坏这个项目(好吧，实际上它只是在你的情况下抛出一个错误，因为你必须在使用 bindAggregation 方法时指定模板或工厂( bindItems 只是此方法的包装) .

纠正此问题的一种选择是使用相对绑定(bind)，然后使用 bindElement 方法来更改表的绑定(bind)。在您的情况下，您并不清楚您想要做什么，如 sBindingPath似乎有一个像 /DataSet(SetId='ABC') 这样的值，它实际上不会指向集合，而是指向单个 DataSet 实体。

如果您实际上更改了 OData 服务的使用方式并且您有导航(例如，路径看起来像 /DataSet('ABC')/MyNavigationSet )，那么您可以执行以下操作:

看法:

<!-- note that the items binding path should not start with / (to be relative) -->
<Table id="favTable" items={MyNavigationSet}>
    <columns>
        <!-- your columns... -->
    </columns>
    <items>
        <ColumnListItem id="favTableItemTemplate">
            <cells>
                <Text text="{Text}" />
                <Text text="{Service}" />
                <Button icon="sap-icon://delete" press="onDeleteRow" />
            </cells>
        </ColumnListItem>
    </items>
</Table>

Controller :

function(oEvent) {
    // the rest of your code
    this.byId("favTable").bindElement(sBindingPath);
}

与您当前的 OData 服务一起使用的另一个选项是将您的模板声明为依赖项，然后将其用于绑定(bind)。 templateShareable应设置标志，以便在重新绑定(bind)聚合时不会破坏模板。

看法:

<Table id="favTable">
    <columns>
        <!-- your columns... -->
    </columns>
    <dependents>
        <ColumnListItem id="favTableItemTemplate">
            <cells>
                <Text text="{Text}" />
                <Text text="{Service}" />
                <Button icon="sap-icon://delete" press="onDeleteRow" />
            </cells>
        </ColumnListItem>
    </dependents>
</Table>

Controller :

function(oEvent) {
    // the rest of your code
    this.byId("favTable").bindItems({
        path: sBindingPath,
        template: this.byId("favTableItemTemplate"),
        templateShareable: true,
        parameters: {
            navigation: {FavoriteGroupSet: "ToFavorites"}
        },
        filters: [new Filter("SetId", "EQ", sSetId)]
    })
}