SAP UI5 SplitApp详情页绑定选中项Valores数组的问题
解决SAP UI5 SplitApp详情页动态绑定选中项Valores数组的问题
看起来你已经离解决问题很近了!问题的核心是要让详情页的列表动态继承主页面选中项的绑定上下文,而不是硬编码固定索引的路径。下面是具体的解决步骤和代码示例:
1. 确保主页面列表正确传递选中项上下文
首先,你的主页面列表应该绑定到caixas>/Caixas,并且设置为SingleSelectMaster模式。SAP UI5的SplitApp默认会在选中主列表项时,自动把选中项的绑定上下文传递给详情页面,不过如果你需要手动控制,也可以通过selectionChange事件来显式设置:
主页面XML代码
<List id="masterCaixasList" mode="SingleSelectMaster" items="{caixas>/Caixas}" selectionChange="onCaixaSelected" > <ObjectListItem title="{caixas>NomeCaixa}" /> </List>
主页面控制器代码(可选,自动传递上下文可省略)
onCaixaSelected: function(oEvent) { // 获取选中项的绑定上下文 const oSelectedContext = oEvent.getParameter("listItem").getBindingContext("caixas"); // 获取SplitApp的详情页实例 const oDetailPage = this.getOwnerComponent().getRootControl().getDetailPage("yourDetailPageId"); // 给详情页设置选中项的上下文 oDetailPage.setBindingContext(oSelectedContext, "caixas"); }
2. 详情页动态绑定Valores数组
现在详情页的绑定上下文已经是选中的Caixas项了,你只需要用相对路径来绑定Valores数组即可,不需要指定固定索引:
详情页XML代码
<List id="caixasValuesList" class="sapUiResponsiveMargin" headerText="Valores do Caixa" width="auto" items="{caixas>Valores}" > <items> <!-- 这里绑定Valores数组里的具体属性,替换硬编码的"banana" --> <ObjectListItem title="{caixas>LabelValor}" number="{caixas>ValorValor}" numberUnit="{caixas>MoedaValor}" /> </items> </List>
为什么之前的硬编码路径不行?
你之前用的{caixas>/Caixas/0/Valores}是绝对路径,它固定指向第一个Caixas项的Valores数组。而相对路径{caixas>Valores}是基于当前页面的绑定上下文的——当详情页的上下文是选中的Caixas项时,这个路径就会自动指向该选中项的Valores数组,实现动态绑定。
这样修改后,你点击主页面的任意Caixas项,详情页都会显示对应项的Valores数据啦!
内容的提问来源于stack exchange,提问作者Rafael Menezes
相关产品推荐
相关产品推荐

