Question

我想知道视图修改后JSON model中的哪个属性发生了变化。对于测试，我参加了OpenUI5演练example并在应用程序控制器中添加了以下行

oProductModel.attachPropertyChange( function(oEvent){
   console.log("event: ", oEvent);
}, this);

当我更改文本输入中的属性时，会调用attachPropertyChange中的函数，但是当我在控制台中打印它时，oEvent对象为空。

我知道我可以连接到文本输入更改事件，但我想使用attachPropertyChange，以防同一模型的多个视图。

Answer 1

您可以对UI中的所有输入字段使用更改事件，并在控制器中编写事件处理方法。您将轻松获得事件处理方法的oEvent中的属性和值。我希望你理解。

Answer 2

据我所知，您希望避免使用Input控件的change事件，因为没有关于模型中哪个属性发生更改的信息。但是，您仍然可以通过以下方式在变更处理程序中获取所有这些信息：

event.getSource().getBinding(/*controlPropertyName*/).getPath()获取绑定属性的名称，或
event.getSource().getBindingContext(/*modelName*/).getPath(/*suffix*/)获取绑定上下文的路径。这里的getPath等待可选后缀，该后缀将附加到上下文路径with a "/" in between。

如果属性绑定是相对的，您可以组合这两个API来获取绝对路径。 E.g：

onInputChange: function(event) {
  const input = event.getSource();
  const property = input.getBinding("value").getPath(); // "myProperty"
  const absolutePath = input.getBindingContext().getPath(property) // "/0/myProperty"
},

演示

＆＃13;

sap.ui.getCore().attachInit(() => sap.ui.require([
  "sap/ui/model/json/JSONModel",
  "sap/m/MessageToast",
], (JSONModel, MessageToast) => sap.ui.xmlview({
  viewContent: `<mvc:View
    xmlns:mvc="sap.ui.core.mvc"
    xmlns="sap.m"
    height="100%"
    displayBlock="true"
  >
    <App>
      <Page title="Type Something"
        content="{myModel>/Products}"
      >
        <Input
          placeholder="Input"
          value="{myModel>ProductID}"
          change=".onChange"
        />
      </Page>
    </App>
  </mvc:View>`,

  controller: {
    onChange: function(event) {
      this.showPropertyInfo({
        bindingContext: event.getSource().getBindingContext("myModel"),
        propertyPath: event.getSource().getBinding("value").getPath(),
        of: event.getSource(),
      });
    },

    showPropertyInfo: ({propertyPath, bindingContext, of}) => MessageToast.show(
      `Property : "${bindingContext ? propertyPath : propertyPath.substr(1)}"
       Absolute Path : "${bindingContext ? bindingContext.getPath(propertyPath) : propertyPath}"`, {
      duration: 999999,
      width: "18rem",
      at: "end bottom",
      of,
    }),

  },
  async: true,

}).setModel(new JSONModel({
  Products: [{
    ProductID: "",
  }, {
    ProductID: "",
  }, {
    ProductID: "",
  }],
}), "myModel").placeAt("content")));

＆＃13;

<script id="sap-ui-bootstrap"
 data-sap-ui-libs="sap.ui.core, sap.m"
 data-sap-ui-preload="async"
 data-sap-ui-theme="sap_belize"
 data-sap-ui-xx-waitForTheme="true"
 src="https://openui5nightly.hana.ondemand.com/resources/sap-ui-core.js"
></script><body id="content" class="sapUiBody"></body>

＆＃13;

注意：目前，由于缺少getPath注释，API Reference中的Binding API @public不可见。但是，这是一个issue的UI5文档，将很快或稍后修复。在此之前，可以找到源代码here。

无法从attachPropertyChange获取更改的属性

2 个答案:

演示