如何在SAPUI5的表格列中创建绑定ODATA数据的跳转链接

云上老周

2026-9-30

实现方案

核心通过sap.m.Link控件绑定OData字段，用复合绑定拼接跳转地址即可，以下是可直接复用的示例代码：

1. Controller 初始化基础地址配置（地址固定可跳过）

将公共基础地址存入JSON模型，方便全局统一管理：

onInit: function () {
  const oAppConfigModel = new sap.ui.model.json.JSONModel({
    mainUrl: "https://你的业务系统基础地址" // 可替换为实际环境地址
  });
  this.getView().setModel(oAppConfigModel, "appConfig");
}

2. XML 视图表格列配置

假设你的OData实体中，第一列对应的ID字段为ReqId，第二列对应的ID字段为JobId，表格列配置如下：

<Table items="{/YourODataSetPath}">
  <columns>
    <Column>
      <Text text="请求ID" />
    </Column>
    <Column>
      <Text text="任务ID" />
    </Column>
    <!-- 其余自定义列 -->
  </columns>
  <items>
    <ColumnListItem>
      <cells>
        <!-- 第一列：reqid跳转链接 -->
        <Link 
          text="{ReqId}"
          target="_blank"
          href="{
            parts: ['appConfig>/mainUrl', 'ReqId'],
            formatter: function(sMainUrl, sReqId) {
              return sMainUrl && sReqId ? `${sMainUrl}/bb/ccc/eee?reqid=${encodeURIComponent(sReqId)}` : '';
            }
          }"
        />
        <!-- 第二列：jobid跳转链接 -->
        <Link 
          text="{JobId}"
          target="_blank"
          href="{
            parts: ['appConfig>/mainUrl', 'JobId'],
            formatter: function(sMainUrl, sJobId) {
              return sMainUrl && sJobId ? `${sMainUrl}/bb/cc/fff?jobid=${encodeURIComponent(sJobId)}` : '';
            }
          }"
        />
        <!-- 其余单元格内容 -->
      </cells>
    </ColumnListItem>
  </items>
</Table>

可选优化：把formatter抽离到Controller

如果拼接逻辑复杂，可把拼接方法放到Controller中统一维护：

Controller中新增格式化方法：

// 格式化请求ID跳转链接
formatReqLink: function(sMainUrl, sReqId) {
  if(!sMainUrl || !sReqId) return '';
  return `${sMainUrl}/bb/ccc/eee?reqid=${encodeURIComponent(sReqId)}`;
},
// 格式化任务ID跳转链接
formatJobLink: function(sMainUrl, sJobId) {
  if(!sMainUrl || !sJobId) return '';
  return `${sMainUrl}/bb/cc/fff?jobid=${encodeURIComponent(sJobId)}`;
}

XML中修改href绑定即可：

<!-- 第一列href -->
href="{parts: ['appConfig>/mainUrl', 'ReqId'], formatter: '.formatReqLink'}"

<!-- 第二列href -->
href="{parts: ['appConfig>/mainUrl', 'JobId'], formatter: '.formatJobLink'}"

注意事项

不需要新窗口打开跳转的话，删掉target="_blank"属性即可
请把示例中的YourODataSetPath、ReqId、JobId替换为你的实际OData实体集路径和字段名
基础地址固定的话，不需要配置appConfig模型，直接把地址写死在formatter的拼接逻辑里即可

内容的提问来源于stack exchange，提问作者Nandita