Как установить заголовок группы для ColumnListItems

Question

У меня есть следующее sap.m.Table:

<Table>
  <columns>
    <Column text="Name" width="200px" />
    <Column text="Number" width="200px" />
  </columns>
  <ColumnListItem>
    <cells> 
      <Text text="{modelExample>name}" />
      <Text text="{modelExample>number}" />
    </cells>
  </ColumnListItem>
</Table>

Модель со следующими данными:

Модель:

var oModelExample = new sap.ui.json.JSONModel();
this.setModel(oModelExample,"modelExample")
this.setData(modelExample.Model) //adds the JSON - Model, below - only the content of "Model"

Данные:

var modelExample = {
  "Model": [
    { title: "First Title", name: "First Name", number: 0 },
    { title: "First Title", name: "Second Name", number: 1 },
    { title: "Second Title", name: "Third Name", number: 2 },
    { title: "Second Title", name: "Fourth Name", number: 3 }
  ]
};

Проблема : он будет перебирать все записи и выводит имя и номер, но я хочу, чтобы он тоже был в состоянии вывести заголовки с номерами / именами, которые у него есть.

Вопрос: Как сгруппировать элементы таким образом, чтобы вывести заголовок, а также все названия / цифры, которые относятся к заголовкам?

Как это должно выглядеть:

Answer 1

Похоже, что вы хотите группировать.

Этого можно добиться с помощью функции группировки привязки ваших элементов.

<Table items="{
  path: 'modelExample>/',
  <em>sorter: {
    path: 'title',
    group: true
  }</em>
}">

Do c: Сортировка, группировка и фильтрация для привязки списка

---

sap.m.Column не имеет text свойство.

Вы должны определить свои столбцы, как это

<Column>
  <Text text="Name" />
</Column>

Answer 2

Я думаю, вы ищете команду сложного связывания. В индексе. html, куда вы загружаете sap-ui-core. js, вам нужно (если это еще не сделано) установить эту команду: data-sap-ui-xx-bindingSyntax="complex"

Затем вы можете изменить свой код на это, например:

<Table>
  <columns>
    <Column text="Name" width="200px" />
    <Column text="Number" width="200px" />
    <Column text="All" width="200px" />
  </columns>
  <ColumnListItem>
    <Text text="{name}" />
    <Text text="{number}" />
    <Text text="{title} {name} {number}" />
  </ColumnListItem>
</Table>

Это отвечает на ваш вопрос?