如何根据ID生成动态列表？

Question

希望我能正确解释我的情况.. 所以我在 OpenUI5 的帮助下开发一个 Recipes 应用程序用于家里的内部目的。

我有一个包含多个收据的列表，它们都有唯一的 ID。所以如果我想看细节的话：

在详细信息部分，我想添加一个包含此收据所需物品的新列表。

所以我的 JSON 模型目前看起来如下：

 {
  "ReceiptCollection": [
    {
      "ID": 1,
      "Name": "Spaghetti Bolognese",
      "Category": "Kochen",
      "Difficulty": "einfach",
      "Description": "Schnell und Einfach",
      "Preparation": "Das Hackfleisch würzen nach Geschmack (Salz, Pfeffer, Knoblauch, Paprika) und in etwas Öl anbraten. Tomatenmark, die Kräuter und gehackte Zwiebel unterrühren und mitbraten. Tomaten mit Saft dazugeben und ca. 45 Minuten köcheln lassen. Mit Salz, Pfeffer und etwas Zucker abschmecken. Milch dazugeben. Soße evtl mit etwas Speisestärke andicken. \n\n Spaghetti wie gewohnt in Salzwasser gar kochen.",
      "Ingredients": [
        {
          "IngID": 1,
          "IngName": "Hackfleisch",
          "UnitNumber": 300,
          "UnitOfMeasure": "Gramm"
        }
      ]
    },

    [...]

在Details.view中我是这样试过的：

            <m:Table id="ingredientsTable"
                   inset="false"
                   noDataText="{i18n>general.NoDataTextIngredients}"
                   items="{
                      path: 'receipts>/ReceiptCollection/0/Ingredients',
                      sorter: {
                        path: 'IngName'
                      }
                   }"
                   class="sapFDynamicPageAlignContent"
                   width="auto">
            <m:columns>
              <m:Column width="auto">
                <m:Text text="{i18n>detail.Ingredient}" />
              </m:Column>
              <m:Column width="auto">
                <m:Text text="{i18n>detail.Amount}" />
              </m:Column>
              <m:Column width="auto">
                <m:Text text="{i18n>detail.UoM}" />
              </m:Column>
            </m:columns>
            <m:items>
              <m:ColumnListItem>
                <m:cells>
                  <m:ObjectIdentifier title="{receipts>IngName}" />
                  <m:Text text="{receipts>UnitNumber}" />
                  <m:Text text="{receipts>UnitOfMeasure}" />
                </m:cells>
              </m:ColumnListItem>
            </m:items>
          </m:Table>

这显然是错误的，因为下面的片段："path: 'receipts>/ReceiptCollection/0/Ingredients'"

有没有办法用 URL 中当前显示的 ID 0 替换？

我需要在控制器中加载 table 内容吗？或者在视图中是否有一种简单的方法来做到这一点？（所以在写这些行时，这似乎有点不对）。

但是如果我在控制器中填充 table - 视图应该是什么样子？

我还是个初学者，我正在努力学习更多，所以请不要杀了我。 :D

感谢您的帮助和最诚挚的问候

Answer 1

我假设您已经管理了导航并在模型中有了数据索引。这是您的操作：

从视图中的 table 中删除项目聚合，使其看起来像这样：

<m:Table id="ingredientsTable"
                   inset="false"
                   noDataText="{i18n>general.NoDataTextIngredients}"
                   class="sapFDynamicPageAlignContent"
                   width="auto">

然后，从控制器进行绑定。我已经把它放在 onInit 事件中了：

onInit: function () {
      /*Ignore if model is set in manifest*/
   var oModel = new sap.ui.model.json.JSONModel("./model/recipes.json");
   this.getView().setModel(oModel, "receipts");
      /*get the index from rourer using 0 for explanation */
      var index=0;
   var oTable = this.getView().byId("ingredientsTable");
      /*Give the path you want to bind to items aggregation*/
   var oItems = "receipts>/ReceiptCollection/" + index + "/Ingredients";
   var oSorter = new sap.ui.model.Sorter('IngName');
      /*Bind it to the items aggregation of the table */
   oTable.bindItems(oItems, oTable.getItems()[0].clone(),oSorter);
  }

希望对您有所帮助

Answer 2

您的问题不是很清楚，假设您正在查看选中时显示收据的详细信息，你想检查一个叫做 Element Binding/Context Binding

的东西

因此，您需要执行以下操作：

将详细视图绑定到所选收据的上下文（或具有 ID 的收据上下文 - 您可以过滤 json）。
Working example of binding context of an array to a View

让我知道这是否有帮助，并尝试编辑问题以通过附加相关期望和您面临的问题使其更清楚。

如何根据ID生成动态列表？

How to generate a dynamic list depending on a ID?

sapui5