SAP UI5：绑定错误答案

【问题标题】：SAP UI5: error in bindingSAP UI5：绑定错误
【发布时间】：2014-02-25 16:18:17
【问题描述】：

尽管在 SAP HCM 开发方面经验丰富，但我刚刚开始学习 UI5（使用 eclipse），所以如果我的问题有点基本，我提前道歉......

我正在尝试创建数据绑定（基于 UI5 rockstar 的示例 DJ Adams），但由于某种原因，没有结果。

在我的控制器中，我输入了以下代码（在 onInit 函数中）来创建数据并使其可用：

onInit: function() {
var cities = [ { id: "A1", name: "Kobe" },
           { id: "A2", name: "Hiroshoma" }
];
        var oModel = new sap.ui.model.json.JSONModel();
        oModel.setData(cities);

        sap.ui.getCore().setModel(oModel);



},

在我看来，我尝试使用以下代码绑定数据：

                        </IconTabFilter>
                        <IconTabFilter
                            binding="{/cities/0}"
                            text="{name}"
                            icon="sap-icon://group"
                            design="Horizontal">

                        </IconTabFilter>
                        <IconTabFilter
                            binding="{/cities/1}"
                            text="{name} ({id})"
                            icon="sap-icon://group"
                            design="Horizontal">

                        </IconTabFilter>

                    </items>
                </IconTabBar>
</content>
</Page>
</core:View>

在我的输出中，所有元素都正确显示，但是我没有得到我在模型中初始化的值。但是我也没有收到任何错误

我的问题： 1.你能提供一些帮助/指导来看看我在哪里出错了吗？ 2. 在数据绑定（调试器、其他提示）方面，检测问题出在哪里的最简单方法是什么？

非常感谢您的指导，

汤姆

【问题讨论】：

只需从绑定中删除 '/cities'。它应该能够获取数据。

标签： sapui5

【解决方案1】：

错误确实在您的绑定中。虽然您有一个变量 cities，但您的 JSON 上下文以 id 开头。您可以将 JSONModel 更新为具有根元素 cities:

.setModel({
  cities: [
    { id: "A1", name: "Kobe" },
    { id: "A2", name: "Hiroshoma" }
  ]
});

至于调试，我更喜欢标准的 Google Chrome 浏览器工具。它允许监视、断点和（小的）实时代码更改。

【讨论】：

非常感谢您的回复。确实，正如您提到的，我将变量的名称与根元素的名称混为一谈。问题已解决，我可以继续探索。
@TomRottiers 请接受此答案，让其他人知道该问题已解决。阅读What should I do when someone answers my question?

【解决方案2】：

请尝试使用模板，而不是绑定单个元素，您可以使用模板将数组绑定到单个元素。示例：

<List
items="{/ProductCollection}"
headerText="Products">
<items>
  <ObjectListItem
    title="{Name}"
    type="Active"
    press="onListItemPress"
    number="{Price}"
    numberUnit="{CurrencyCode}">
    <firstStatus>
      <ObjectStatus
        text="Overweight"
        state="Error" />
    </firstStatus>
    <secondStatus>
      <ObjectStatus
        text="In Stock"
        state="Success" />
    </secondStatus>
    <attributes>
      <ObjectAttribute text="{WeightMeasure} {WeightUnit}" />
      <ObjectAttribute text="{Width} x {Depth} x {Height} {DimUnit}" />
    </attributes>
  </ObjectListItem>
</items>

[现场示例：https://sapui5.hana.ondemand.com/sdk/explored.html#/sample/sap.m.sample.ObjectListItem/code]

如果你想对数据有更好的控制，那么你可以设置多个带有键值对的模型。

例子：

sap.ui.getCore().setModel("key",oModel);

并获得价值：

sap.ui.getCore().getModel("key");

【讨论】：

【解决方案3】：

您创建模型的方法并不安静。可变城市不是对象而是数组。您可以将数据设置为模型：

onInit: function() {
var cities ={ "cities": [{ "id": "A1", "name": "Kobe" },
                     { "id": "A2", "name": "Hiroshoma" }
                     ]}
    var oModel = new sap.ui.model.json.JSONModel();

    oModel.setData(cities);

    sap.ui.getCore().setModel(oModel);

},

或者你可以设置属性：

var cities = [ { id: "A1", name: "Kobe" },
       { id: "A2", name: "Hiroshoma" }
];
    var oModel = new sap.ui.model.json.JSONModel();

    oModel.setProperty("/cities", cities);

    sap.ui.getCore().setModel(oModel);

你还必须正确绑定你的xml。您可以按照 SapUi5 探索或开发人员指南中的列表项模板进行操作

【讨论】：