Html 有角度的去扁平或按摩阵列

我有一个JSON响应，其中包含对象的数组。我想知道如何以角度的方式将其展平以显示在材质表中。 我想将accessID和desc扁平化为一个扁平数组，如[ADPRATE、QUOCON、USRIDMAN]

"data": [
    [
        {
            "categoryId": "ADPDSHB",
            "categoryDesc": "Dashboard - Admin",
            "categoryAccess": [
                {
                    "BoRefAccess": {
                        "accessId": "ADPRATE",
                        "accessDesc": "Adoption Rate"
                    }
                },
                {
                    "BoRefAccess": {
                        "accessId": "QUOCON",
                        "accessDesc": "Quotation Conversion "
                    }
                }
            ]
        }
    ],
    [
        {
            "categoryId": "USRMAN",
            "categoryDesc": "User Management",
            "categoryAccess": [
                {
                    "BoRefAccess": {
                        "accessId": "USRIDMAN",
                        "accessDesc": "User ID Management"
                    }
                }
            ]
        }
    ]
]

新的预期结果，通过展平内部阵列

  {
       {
        "categoryId": "ADPDSHB",
        "categoryDesc": "Dashboard - Admin",
        "categoryAccess": 
            {
                "BoRefAccess": {
                    "accessId": "ADPRATE",
                    "accessDesc": "Adoption Rate"
                }
            },
         },
            {
        "categoryId": "ADPDSHB",
        "categoryDesc": "Dashboard - Admin",
        "categoryAccess": 
            {
                "BoRefAccess": {
                    "accessId": "QUOCON",
                    "accessDesc": "Quotation Conversion"
                }
            },
         },

表格示例

---

如果您知道循环是基于这些特殊属性的，您可以对循环进行一些自定义

 let newDataObject;
 const idArray = [];
 const descArray = []
       data.forEach(objectArray => {
             objectArray.forEach(object => {
                 object.categoryAccess.forEach(category => {
                     idArray.push(category.BoRefAccess.accessId);
                     descArray.push(category.BoRefAccess.accessDesk);
                 }
             }
       }
// at this point you will have added in all of the elements into their respective arrays for all
// of the objects. You may have to alter your loop nesting, but that's the idea

希望这有帮助， 快乐编码

请像这样试试

const data = {"data": [
    [
        {
            "categoryId": "ADPDSHB",
            "categoryDesc": "Dashboard - Admin",
            "categoryAccess": [
                {
                    "BoRefAccess": {
                        "accessId": "ADPRATE",
                        "accessDesc": "Adoption Rate"
                    }
                },
                {
                    "BoRefAccess": {
                        "accessId": "QUOCON",
                        "accessDesc": "Quotation Conversion "
                    }
                }
            ]
        }
    ],
    [
        {
            "categoryId": "USRMAN",
            "categoryDesc": "User Management",
            "categoryAccess": [
                {
                    "BoRefAccess": {
                        "accessId": "USRIDMAN",
                        "accessDesc": "User ID Management"
                    }
                }
            ]
        }
    ]
]}

编辑：基于评论

data.data.map(item => {
    console.log(item[0])
    return {
       "categoryId" : item[0].categoryId,
       "categoryDesc" : item[0].categoryDesc, 
       "categoryAccess" : item[0].categoryAccess.filter(access =>access["BoRefAccess"].accessId === item[0].categoryId) 
    }
})

---

此逻辑过滤掉类别访问数组。它将仅显示具有samme类别id的项目。希望这就是您要查找的内容。

我不确定原因，但我无法在我的typescript环境中显示平面函数。我已添加了另一个解决方案，以使用映射函数进行解答。请尝试使用平面法。您可能需要在polyfil.ts文件中添加其多边形填充。再次感谢，我用更新的预期结果更新了问题哇..这是我看到的最佳答案…我得到了结构。。。现在的问题是…如何将它们显示到material table中，哪列是accessID、accessDesc及其自己的categoryID？再次感谢，我用更新的预期结果更新了问题您的预期结果语法错误。周围的{}应该改为[]啊是的…谢谢你的更正。。。此外，如果有任何方式，你可以在自己的类别下分组所有访问？请查看我更新的ANWR