Question

专家，

我需要在扩展的Fiori应用程序中将动态ID声明为XML视图。我需要这个，因为我需要根据Item值设置图像src。

有没有办法做这样的事情？

<Image id="myImage{MyModelProperty}" />

此致安德烈

Answer 1

计算字段将满足您的要求。

1.在引导程序配置data-sap-ui-xx-bindingSyntax="complex"中设置标志。详情为here

2.在控制器js中定义格式化程序功能。

imageFormatter : function(value) {
    var imageSrc = "myImage" + value;
    return imageSrc;
}

3.在XML视图中声明图像如下

<Image src="{path:'MyModelProperty',formatter:'.imageFormatter'}"/>

希望它能解决您的问题。

Answer 2

据我所知，无法从模型属性构建ID。为什么要构建图像的ID而不是src属性？如果要确保图像ID的唯一性，那么只需让框架来处理它。

如果将src属性与模型绑定一起使用，则基础模型属性的更改将立即在UI上生效。只需调用模型实例上的setProperty("MyModelProperty", "new_image_postfix")即可。

带有按钮及其文本绑定的简短示例：

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>

    <script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
            data-sap-ui-libs="sap.ui.commons"
            data-sap-ui-theme="sap_goldreflection">
    </script>
    <script type="text/javascript">
      var oModel = new sap.ui.model.json.JSONModel();
      oModel.setData({txt: "Sample"});
      sap.ui.getCore().setModel(oModel);
      var oButton = new sap.ui.commons.Button({id:"testBtn", text:"{/txt}", press:function(oEvent) { oModel.setProperty("/txt", "SampleUpdated") } });
      oButton.placeAt("content");
    </script>
  </head>
  <body class="sapUiBody" role="application">
    <div id="content"></div>
  </body>
</html>

XML视图中的动态ID

2 个答案: