自定义 UI5 控件不更新绑定值

Question

如何将 OData 值传递给自定义 UI5 控件的属性？我试过了，但是 不工作。
如果我尝试将它传递给像 <Text> 这样的正常控件，它工作很好。
如果我尝试传递一个静态值，它工作也很好：

<cc:CheckPrice valuePrice="{Price}"/> <!--❌-->
<Text text="{Price}"/> <!--✔️-->
<cc:CheckPrice valuePrice="1000"/> <!--✔️-->

如何从远程 OData 服务传递值以像在文本控件中一样显示它？

sap.ui.define([
    "sap/ui/core/Control",
    "sap/m/Label",
    "sap/m/Button"
], function (Control, Label, Button) {
    "use strict";

    return Control.extend("zgutfiory.zguttestfiorylr.controls.CheckPrice", {
        metadata: {
            properties: {
                "valuePrice": {
                    type: "string",
                    bindable: "bindable"
                }
            },
            aggregations: {
                "_label": {
                    type: "sap.m.Label",
                    multiple: false,
                    visibility: "hidden"
                },
                "_button": {
                    type: "sap.m.Button",
                    multiple: false,
                    visibility: "hidden"
                }
            },
            events: {
                // ...
            }
        },

        init: function () {
            this.setAggregation("_label", new Label({
                text: "{i18n>controlCheckPrice}"
            }).addStyleClass("sapUiSmallMargin"));
            this.setAggregation("_button", new Button({
                text: "{i18n>controlCheckPrice}",
                press: [this._onSubmit, this]
            }).addStyleClass("sapUiTinyMarginTopBottom"));
        },

        _onSubmit: function (oEvent) {
            // ...
        },

        renderer: function (oRm, oControl) {
            oRm.write('<div class="zgutCheckPriceWrap">');
            oRm.write('<div class="zgutPriceWrap">' + oControl.getValuePrice() + '</div>');
            oRm.renderControl(oControl.getAggregation("_label"));
            oRm.renderControl(oControl.getAggregation("_button"));
            oRm.write('</div>');
        }
    });
});

UI5版本：1.92

Answer 1

自定义控件的绑定与标准控件完全相同。必须考虑以下几点：

如果父容器，例如视图与上下文绑定，您必须提供您绑定值的属性的相对路径，例如{Price}。否则，给出绝对路径，例如{/Price}
如果模型已命名，请务必在绑定时提供名称。例如。 {namedModel>/Price}
路径也可以是多级的。例如。 {ToCategory/CategoryName} 用于 OData 属性使用 NavigationProperty 绑定 ToCategory

Answer 2

您似乎只是漏掉了前导斜杠？

<cc:checkPrice id="checkPrice" valuePrice="{/Price}" class="sapUiSmallMarginBeginEnd" />

Answer 3

您错过了在渲染函数中添加一些强制控制数据。当模型值发生变化时（例如 ODataModel 接收数据），具有绑定属性的控件至少需要由 id 识别，以便控件可以更新。在您的情况下，id 未呈现。

要添加所需的控制数据，请使用：

oRm.openStart("div"<strong>, oCotrol</strong>) 在新的情况下 语义渲染 (UI5 ≥ 1.67).
oRm<strong>.writeControlData(oControl)</strong> 在现在已弃用的 基于字符串的渲染中 (UI5 ≤ 1.66)。 注意：这里oControl.getValuePrice()请用.writeEscaped来避免XSS。

此外，如果覆盖借用的方法（例如 init），请确保调用超级函数。这对于生命周期挂钩尤其重要。

样本：https://embed.plnkr.co/gnmPoh3KS7L3DDXZ?show=controls%2FCheckPrice.js,preview

有关详细信息，请参阅 API reference: sap/ui/core/RenderManager。

自定义 UI5 控件不更新绑定值

Custom UI5 control does not update bound value

data-binding

sapui5

sap-fiori