控件呈现器中的数据绑定

Question

如何在自定义控件的呈现器中使用来自模型的数据绑定？ m.getProperty("/time/0/hours") 函数 returns 未定义。 span 中的绑定，
oRm.write("{/time/0/hours}") returns 文字字符串，如果没有引号则出错。

我有一个带有自定义控件的 XML 视图：

<mvc:View
  controllerName="view.Calendar"
  xmlns:mvc="sap.ui.core.mvc"
  xmlns:c="control"
  xmlns="sap.m">

    <c:TimeCalendar 
      id="calIdView"
      hoursData="data.json" />

</mvc:View>

控制器：

sap.ui.controller("view.Calendar", {

  onInit: function(oEvent){
    jQuery.sap.includeStyleSheet("main.css");

    var oModel = new sap.ui.model.json.JSONModel("data.json");
    this.getView().setModel(oModel, "hours");
  }

});

还有我的自定义控件：

sap.ui.unified.Calendar.extend("control.TimeCalendar", {

    metadata : {
        properties : {
            "hoursData" : "string"
        }
    },


  // the part creating the HTML:
  renderer:{

    renderDays: function(oRm, oCal, oDate){
        if (!oDate) {
            oDate = oCal._getFocusedDate();
        }

        var sHoursData = oCal.getHoursData();
        var oModel = new sap.ui.model.json.JSONModel(sHoursData);
        oCal.setModel(oModel);
        var m = oCal.getModel("hours");
        console.log(m.getProperty("/time/0/hours"));

        ...

        oRm.write("<span class=\"hours\">");
        oRm.write("{/time/0/hours}");
        oRm.write("</span>");

Answer 1

您无论如何都不应该在渲染器中编辑控件。渲染器只应该编写在页面上渲染控件所需的 HTML。模型绑定已经在您的控制器中发生。作为视图中的一个元素，您的自定义控件将继承模型并能够使用它。在渲染器中，您可以访问将由模型设置的控件的属性。

查看：

<mvc:View
  controllerName="view.Calendar"
  xmlns:mvc="sap.ui.core.mvc"
  xmlns:c="control"
  xmlns="sap.m">

    <c:TimeCalendar 
      id="calIdView"
      hoursData="{hours&gt;/time/0/hours}" />

</mvc:View>

控制：

sap.ui.unified.Calendar.extend("control.TimeCalendar", {
    metadata: {
        properties: {
            "hoursData": "string"
        }
    },
    renderer: {
        renderDays: function (oRm, oCal, oDate) {
            if (!oDate) {
                oDate = oCal._getFocusedDate();
            }

            oRm.write("<span class=\"hours\">");
            oRm.write(oCal.getHoursData());
            oRm.write("</span>");

控件呈现器中的数据绑定

Data binding in a control renderer

javascript

sapui5