无法从 attachPropertyChange 获取更改的属性 [英] Can't get changed property from attachPropertyChange

查看:23
本文介绍了无法从 attachPropertyChange 获取更改的属性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想知道JSON 模型 在被视图修改时发生了变化.为了测试,我参加了 OpenUI5 演练 example 并在应用程序控制器中添加以下几行

I would like to know which property in the JSON model has changed when modified by a view. For a test I took OpenUI5 walkthrough example and added the following lines in the application controller

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

当我更改文本输入中的属性时,attachPropertyChange 中的函数被调用,但 oEvent 对象在控制台中打印时为空.

When I change a property in the text input, the function in the attachPropertyChange is called but oEvent object is empty as I print it in console.

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

I know I could connect to text input change event, but I would like to use attachPropertyChange in case there would be multiple views of the same model.

推荐答案

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

As far as I understood, you'd like to avoid using the change event of the Input control because there is no information about which property in the model has changed. However, you can still get all those information within the change handler via:

  • event.getSource().getBinding(/*controlPropertyName*/).getPath() 获取绑定属性的名称,或
  • event.getSource().getBindingContext(/*modelName*/).getPath(/*suffix*/) 获取绑定上下文的路径.此处的 getPath 等待一个可选的后缀,该后缀将附加到上下文路径 中间有一个 "/".
  • event.getSource().getBinding(/*controlPropertyName*/).getPath() to get the name of the bound property, or
  • event.getSource().getBindingContext(/*modelName*/).getPath(/*suffix*/) to get the path of the bound context. The getPath here awaits an optional suffix that will be appended to the context path with a "/" in between.

如果属性绑定是相对的,您可以组合这两个 API 以获得绝对路径.例如:

You can combine those two APIs to get an absolute path in case the property binding was relative. E.g.:

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

演示

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")));

<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>

注意:目前,API 参考 由于缺少 @public 注释.但是,这是 UI5 文档的问题,很快就会修复或之后.到那时,可以找到源代码这里.

Note: Currently, the API getPath of Binding is not visible in the API Reference due to the missing @public annotation. However, that's an issue of UI5 documentation which will be fixed soon or later. Until then, the source code can be found here.

这篇关于无法从 attachPropertyChange 获取更改的属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆