javascript - 控件渲染器中的数据绑定(bind)

Question

如何在自定义控件的渲染器中使用模型中的数据绑定(bind)？ m.getProperty("/time/0/hours") 函数返回未定义。 Span 中的绑定(bind)，
oRm.write("{/time/0/hours}") 返回文字字符串，如果不带引号，则会出错。

我有一个带有自定义控件的 XML View :

<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>

Controller :

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。 模型绑定(bind)已经在您的 Controller 中发生。作为 View 中的元素，您的自定义控件将继承模型并能够使用它。 在渲染器中，您只需访问将由模型设置的控件的属性。

查看:

<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>");