SAPUI5 XML 视图绑定与来自同一模型的参数答案

【问题标题】：SAPUI5 XML View Binding with parameters from same modelSAPUI5 XML 视图绑定与来自同一模型的参数
【发布时间】：2017-12-19 10:24:19
【问题描述】：

我有以下问题：

我想开发一个购物车，产品卡的计数器有问题，在摘要视图中显示数据有问题。

对于这个项目，我使用 XML 视图，并且我已经阅读了很多关于绑定的内容。当我想绑定静态路径时，我没有问题。数据来自名为“cartData”的 JSON 模型。

示例（来自 goToCart 按钮）

...
text="{cartData>/currentUser}";
...

一切都正确显示（在示例中），但是对于我的项目，我需要绑定一个主绑定（用于购物车的计数器），并且此路径需要用户的参数。保存在示例中的路径中。

我已经尝试了很多组合来解决这个错误，但现在我没有更多的想法:-(

我尝试过的组合示例：

text="{ ${cartData>/cartOfUser/} + {cartData>/currentUser} + '/roles/counter'}"

编辑：

我的代码的一些虚拟部分：

我的按钮（还不能按我的需要工作...）：

<m:Button
                id="details.Btn.ShowCart"

                text="{ parts: [
                    {path: 'cartProducts>/cartEntries/'},
                    {path: 'cartProducts>/currentChoice/'},
                    {path: '/addedRoles/counter'}
                ]}"

                type="Emphasized"
                icon="sap-icon://cart-3"
                iconFirst="true"
                width="auto"
                enabled="true"
                visible="true"
                iconDensityAware="false"
                press="showCart"/>

我在 LocalStorage 中的 JSON 模型是什么样子的：

{
    "cartEntries": {
        "counter": 2,
        "UserId12": {
            "UserId": "UserId12",
            "Email": "Email12",
            "dateCreated": "2017-07-14T13:18:13.632Z",
            "dateUpdated": "2017-07-14T13:18:13.632Z",
            "addedRoles": {
                "counter": 0
            },
            "existingRoles": {
                "counter": 0
            }
        },
        "UserId14": {
            "UserId": "UserId14",
            "Email": "Email14",
            "dateCreated": "2017-07-14T13:18:30.415Z",
            "dateUpdated": "2017-07-14T13:18:30.415Z",
            "addedRoles": {
                "counter": 0
            },
            "existingRoles": {
                "counter": 0
            }
        }
    },
    "currentChoice": "UserId14"
}

我的带有评论的 JSON 数据： I need to grab the value from "currentChoice", to search with this information in cartEntries for the right counter

按钮现在的样子： It show the data not in the correct way. Please ignore the zero at first...

目标是获取“currentChoice”的值并将其用作“参数”来为正确的用户调用信息。..

我也尝试过：

text="{= ${= 'cartProducts>/cartEntries/' + ${cartProducts>/currentChoice/} + '/addedRoles/counter' } }"

有效，但我更需要“动态”的是：

text="{cartProducts>/cartEntries/UserId14/addedRoles/counter}"

我希望你们现在明白我的意思了... :-/

最好的问候

解决方案

我如何解决这个问题：

为按钮添加格式化程序：

/', 格式化程序：'.formatter._getCartInt' }" 类型=“强调” 图标="sap-icon://cart-3" 图标第一=“真” 宽度=“自动” 启用=“真” 可见=“真” 图标密度感知=“假” press="showCart"/>
在我的 formatter.js 文件中实现格式化程序：

_getCartInt: 函数 (sP1) { var sCurrent = sP1.currentChoice; var sFinalString = "cartProducts>/cartEntries/" + sCurrent + "/addedRoles/counter"; this.getView().byId("btn.ShowCart").bindProperty("text",{path: sFinalString, type: new sap.ui.model.type.Integer()}); }

【问题讨论】：

你需要一个格式化程序（或不同的绑定方法）。如果您分享一些代码可能会提供更多帮助:)
“cartOfUser”属性是什么？
@AndriiNaumovych：它保存有关用户和他们的购物车的信息。

标签： xml routing sapui5

【解决方案1】：

可以这样回答：您不能在绑定中使用表达式（同样适用于类）。因此，要获得您想要的输出，您确实需要一个格式化程序 + 在绑定部分中包含 JSON 模型所需的顶级元素（以便正确更新）。

XML（我假设您的模型称为“cartData”）

<Text text="{
    parts: [
        'cartData>/cartEntries',
        'cartData>/currentChoice'
    ], 
    formatter: '.myFormatter'
}" />

JS 控制器

controller.prototype.myFormatter = function (cartEntries, currentChoice) {
    if (cartEntries && cartEntries[currentChoice]) {
        return cartEntries[currentChoice].addedRoles.counter;
    }
}

[代码未测试]

【讨论】：

【解决方案2】：

尝试使用以下方法：

在 i18n 文件中：

cartInfoTitle=User: {0} has: {1} items in the cart

在 XML 视图中：

<Text text="{
    parts: [
        {path: 'i18n>cartInfoTitle'}, 
        {path: 'modelName>/property1'}, 
        {path: 'modelName>/property2'}
    ], 
    formatter: 'jQuery.sap.formatMessage'
}" />

因此，您声明 i18n 条目，然后使用预定义的格式化程序将占位符替换为“parts”数组 (Documentation article) 中的值。

【讨论】：