【发布时间】：2018-10-04 03:24:05
【问题描述】：
由于我对 Angular 5 有点陌生，我很难以下面的格式显示以下 json。请参阅图片。
我还添加了示例输出 json。
Sample Json:
{
"shape": [{
"id": "1",
"shapeDetails": [
{
"name": "someShape1",
"number": "10",
"identifier": "111"
},
{
"name": "someShape1",
"number": "10",
"identifier": "222"
},
{
"name": "someShape2",
"number": "30",
"identifier": "333"
}
],
"task": {
"title": "first level",
"key": "",
"value": "",
"childtask": [
{
"title": "second level1",
"key": "number",
"value": "10",
"childtask": [
{
"title": "third level1",
"key": "identifier",
"value": "111",
"childtask": []
},
{
"title": "third level2",
"key": "identifier",
"value": "222",
"childtask": []
}
]
},
{
"title": "second level2",
"key": "number",
"value": "30",
"childtask": []
}
]
}
}
]
}
伪代码
1.Iterate through the task. 2. print the first level info 3. go to second level 4. get the key and value 5. match the key value with shapeDetails. 6. get that matching details. 7. go to third level 8. get the key and value 9. match the key value with shapeDetails. 10. get that matching details. 11. Put the third level under the matching second level shape details
我需要在 Angular ui 中以这种方式显示上面的 json。 图片 [1]：https://i.stack.imgur.com/pqsHm.jpg.Since shapeDetails 最多可以有 2000 个对象，它的最佳解决方案是什么？ 此外，任务将只有 3 个级别，不超过此级别。
我在下面添加了输出json：
Expected Output:
{
"shape": [
{
"firstLevelDetails": {
"title": "first level",
"secondLevelDetails": [
{
"title": "second level1",
"shapeDetail": {
"name": "someShape1"//associated with number 10
},
"thirdLevelDetails": [
{
"title": "third level1"//identifier associated with number 10
},
{
"title": "third level2"//identifier associated with number 10
}
]
},
{
"title": "second level2",
"shapeDetail": {
"name": "someShape2" //associated with number 30
}
}
]
}
}
]
}
谢谢
【问题讨论】：
-
看起来这是你的作业。请展示你所做的和尝试的。
-
这不是我的作业。这是我的工作。在 Angular 5 中工作。我无法粘贴我所做的事情。因为这将违反我的办公室政策。我什至修改了 json 。修改我所做的以便我可以在这里显示是很多任务。
-
请提供您预期的 json 输出
-
我已经在问题中提供了输出。
-
我已经编写了解决方案并且工作正常。感谢@AmayaSan。我从来没有想过根据它创建输出 json 和编码。如你所问。我制作了 json 并编写了提供输出 json 的代码，一切正常。