How to Structure Associative Array to Inject into `dom-repeat`

寵の児 提交于 2019-12-13 17:40:00

问题


I have an array of arrays that I would like to use in a dom-repeat, but am getting an error saying the data isn't array-like.

dom-repeat.html:465 dom-repeat expected array for items, found {0: Array(1), 1: Array(1), 2: Array(13)...

The original data in order line items and is being converted into the array of arrays data to sort into cards. I think ideally the pattern would be something like:

Card Parent

<template is="dom-repeat" items="[[data]" index-as="index">
  <card-item-group data="[[item]]"></card-item-group> -->
</template>

Card Child

<template is="dom-repeat" items="[[data]" index-as="index">
  <card-items data="[[item]]"></card-items> -->
</template>

Am I approaching this the wrong way?

Can I merge the line items into cards some other way?

Original data set:

[{
  "0": {
    "time": "2018-02-20",
    "description": "Item 1",
    "number": "1193312"
  },
  "1": {
    "time": "2018-02-21",
    "itemDesc": "Item 2",
    "number": "1193314"
  },
  "2": {
    "time": "2018-02-21",
    "description": "Item 3",
    "number": "1193314"
}

Grouped data set:

[{
  "0":[
   {
      "time": "2018-02-20",
      "description": "Item 1",
      "number": "1193312"
    }
  ],
  "1":[
    {
      "time": "2018-02-21",
      "itemDesc": "Item 2",
      "number": "1193314"
    },{
      "time": "2018-02-21",
      "description": "Item 3",
      "number": "1193314"
    }
  ]
}]
|improve this question

回答1:


Your data isn't an array.

Do some transform on it like so:

original.map((item) =>
    Object.keys(item).map((key) => item[key]));

This'll result in:

[
    [
        {
            "time": "2018-02-20",
            "description": "Item 1",
            "number": "1193312"
        },
        {
            "time": "2018-02-21",
            "itemDesc": "Item 2",
            "number": "1193314"
        },
        {
            "time": "2018-02-21",
            "description": "Item 3",
            "number": "1193314"
        }
    ]
]

Then do your grouping...



来源:https://stackoverflow.com/questions/49430244/how-to-structure-associative-array-to-inject-into-dom-repeat

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!