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

时间:2018-11-16 10:08:57

标签: sapui5

希望我能正确解释我的情况。.所以我正在OpenUI5的帮助下在家庭内部使用Recipes App。

我有几个收据的清单,每个收据都有唯一的ID。因此,如果我想查看详细信息:

http://##URL##/myreceipts/#/detail/0

在详细信息部分,我想添加一个新列表,其中包含此收据所需的内容。

所以我的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>

这显然是错误的,因为以下代码段:“路径:'receipts> / ReceiptCollection / 0 / Ingredients'“

有什么方法可以用URL中当前显示的ID替换ID 0?

我是否需要在Controller中加载表内容?还是在视图中只是一种简单的方法? (因此,在编写这些行时似乎有点不对劲)。

但是如果我在Controller中填写表格-视图应如何显示?

我仍然是一个初学者,并且我想进一步了解这一点,所以请不要杀死我。 :D

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

2 个答案:

答案 0 :(得分:0)

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

  1. 从视图中的表中删除项目聚合,使其看起来像这样:

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

  1. 然后,从控制器进行绑定。我把它放在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);
		}

希望这会有所帮助

答案 1 :(得分:0)

您的问题不是很清楚,假设您正在查看选中收据时的详细信息, 您想要检查名为Element Binding/Context Binding

的内容

所以,这是您要做的:

让我知道这是否有帮助,并尝试通过附加相关的期望和您遇到的问题来编辑问题,使其更清晰。