如何将模型 json 绑定到控制器中的组合框？

Question

我想将模型 json 与控制器内的组合框绑定（不在 xml 视图中）。我制作了一个名为 types.json 的模型 Json 并传递给了控制器，但是，当我将创建的模型中的值绑定到组合框时，没有显示任何内容。

你能帮帮我吗？我在这里找不到问题。

下面是我的部分代码，我认为谁对这个问题很重要。

我的模型JSON - 姓名：types.json

  "types": [
      {
          "text": "Férias",
          "key": "01"
      },
     {
          "text": "something",
          "key": "02"
      },
  ]

我的控制器 - 名称：Page.controller.js

handleAppointmentCreate：函数（oEvent）{ var oStartDate = oEvent.getParameter("开始日期"), oEndDate = oEvent.getParameter("endDate"), oCalendarRow = oEvent.getParameter("calendarRow"), oEmpId = oCalendarRow.getKey(),

                  _oYearStartDate = oStartDate.getFullYear(),
                  _oMonthStartDate = oStartDate.getMonth() + 1,
                  _oDateStartDate = oStartDate.getDate(),

                  _oYearEndDate = oEndDate.getFullYear(),
                  _oMonthEndDate = oEndDate.getMonth() + 1,
                  _oDateEndDate = oEndDate.getDate(),

                  _HourStart = oStartDate.getHours(),
                  _oMinStart = oStartDate.getMinutes(),
                  _oSecStart = oStartDate.getSeconds(),

                  _oHourEnd = oEndDate.getHours(),
                  _oMinEnd = oEndDate.getMinutes(),
                  _oSecEnd = oEndDate.getSeconds(),


                  sStartDate = _oYearStartDate + "-" + _oMonthStartDate + "-" + _oDateStartDate,
                  sEndDate = _oYearEndDate + "-" + _oMonthEndDate + "-" + _oDateEndDate,
                  sStartHour = _HourStart + ":" + _oMinStart + ":" + _oSecStart,
                  sEndHour = _oHourEnd + ":" + _oMinEnd + ":" + _oSecEnd,
                  sIdEmp = oEmpId;

                  var dataModel = this.getOwnerComponent().getModel("Model"); 
                  this.getView().setModel(dataModel, "DataModel"); 

              if (!this.oConfirmDialog) {
                  this.oConfirmDialog = new Dialog({
                      type: DialogType.Message,
                      title: "Novo agendamento",
                      content: [
                          new HorizontalLayout({
                              content: [
                                  new VerticalLayout({
                                      width: "120px",
                                      content: [
                                          new Text({ text: "Id de funcionário: " }),
                                          new Text({ text: "Data de inicio: " }),
                                          new Text({ text: "Data de término: " }),
                                          new Text({ text: "Hora de inicio: " }),
                                          new Text({ text: "Hora de término: " })
                                      ]
                                  }),
                                  new VerticalLayout({
                                      content: [
                                          new Text({text: sIdEmp }),
                                          new Text({ text: sStartDate }),
                                          new Text({ text: sEndDate }),
                                          new Text({ text: sStartHour }),
                                          new Text({ text: sEndHour })
                                      ]
                                  })
                              ]
                          }),
                          new TextArea("confirmationTitle", {
                              width: "100%",
                              placeholder: "Adicione o titulo do agendamento"
                              //required:"true" - não pode ter
                          }),
                          new TextArea("confirmationDetails", {
                              width: "100%",
                              placeholder: "Adicione detalhes do agendamento"
                              //required:"true" - não pode ter
                          }),

                          new sap.m.ComboBox({
                              items: {
                                  path: "DataModel>/types",   
                                  template: {
                                      Type: "sap.ui.core.ListItem",
                                      text: "{DataModel>Key}",
                                      enabled: true
                                  }
                              }
                          })
                      ],

                      beginButton: new Button({
                          type: ButtonType.Emphasized,
                          text: "Submeter",
                          press: function () {
                              var sIdEmp1 = sIdEmp,
                                  sStartDate1 = sStartDate,
                                  sEndDate1 = sEndDate,
                                  sStartHour1 = sStartHour,
                                  sEndHour1 = sEndHour,
                                  sTitle = Core.byId("confirmationTitle").getValue(),
                                  sDetails = Core.byId("confirmationDetails").getValue();

                              this.addAppointment(sIdEmp1, sStartDate1, sEndDate1, sStartHour1, sEndHour1, sTitle, sDetails);
                              this.oConfirmDialog.close();
                          }.bind(this)
                      }),
                      endButton: new Button({
                          text: "Cancelar",
                          press: function () {
                              this.oConfirmDialog.close();
                          }.bind(this)
                      })
                  });
              }
              this.oConfirmDialog.open();

          },

Answer 1

首先，有一个错字。在您的模型中，您有字符串“key”，但是在创建 ComboBox 时，您使用了“Key”和一个大写的 K。确保在两个地方都使用相同的字符串。

如果这不能解决您的问题，请尝试使用 sap.ui.core.Item 而不是 sap.ui.core.ListItem，因为它是聚合 items 接受的控件：

new sap.m.ComboBox({
    items: {
        path: "DataModel>/types",
        template: new sap.ui.core.Item({
            key: "{DataModel>key}",
            text: "{DataModel>text}"
        })
    },
    enabled: true
})

此外，请记住，只有当您有 13 到 200 个结果时才推荐 ComboBox。对于少于 13 个要显示的选项，请改用 sap.m.Select。

如何将模型 json 绑定到控制器中的组合框？

How to bind a model json to a comboBox in controller?

data-binding

json

combobox

sapui5