如何正确使用 JSONModel 和 setModel?

Sor*_*aky 4 sapui5 sap-web-ide

我正在尝试使用 SAP Web IDE 创建一个示例屏幕,其中单击不同的按钮会更改屏幕周围的不同文本。我在 App.controller.js 中有几个函数,代码是这样的(所有函数现在都一样,但影响不同的文本区域):

onPressButton2: function () {
  var oData = {
    text: {
      line1: "line1",
      line2: "line2",
      line3: "line3",
      line4: "line4"
    }
  };
  var oModel = new JSONModel(oData);
  this.getView().setModel(oModel);
},
Run Code Online (Sandbox Code Playgroud)

这是 XML 中的相应部分:

<items>
  <Text xmlns="sap.m" text="{/text/line1}" id="text1"/>
  <Text xmlns="sap.m" text="{/text/line2}" id="text2"/>
  <Text xmlns="sap.m" text="{/text/line3}" id="text3"/>
  <Text xmlns="sap.m" text="{/text/line4}" id="text4"/>
</items>
Run Code Online (Sandbox Code Playgroud)

这有效,但是当我尝试更改屏幕的不同区域时,我之前通过单击按钮所做的更改消失了。我认为这是因为我使用setModel每次都重新它覆盖它但我找不到正确的用法。

我应该为屏幕中的每个部分创建一个不同的 js 文件吗?
有没有办法更新模型而不是全部覆盖?

小智 5

尝试JSONModelonPressButton函数之外声明你。您可以在清单中声明它对整个应用程序(控制器和视图)可见:

"sap.ui5": {
    "_version": "1.1.0",
    ...
    "models": {
        "i18n": {
            "type": "sap.ui.model.resource.ResourceModel",
            "uri": "i18n/i18n.properties"
        },
        "MyModel" : {
            "type" : "sap.ui.model.json.JSONModel"
        }
Run Code Online (Sandbox Code Playgroud)

一旦模型可用,您就可以在onPressButton2函数之外为其设置数据:

this.getOwnerComponent().getModel("MyModel").setData(oData)
Run Code Online (Sandbox Code Playgroud)

现在,在onPressButton2函数中,您可以使用以下setProperty方法更新模型的数据:

this.getOwnerComponent().getModel("MyModel").setProperty("/text/line1", "NewValue");
Run Code Online (Sandbox Code Playgroud)