`
`我有一个表结构,如附件中的图像,我的json结构是这样的
我可以将表格形成位置,但由于无法获取位置变量的范围而无法访问路由器详细信息
这个JSON对我来说看起来很复杂,并且无法获得用于按需构建表结构的变量范围。我也尝试在表格内部形成表格,但由于内部表格标记被终止,因此范围也无法使用
请帮助我形成表格结构
[
{
"regionName": "Australia",
"locations": [
{
"locationname": "sydney",
"routers": [
{
"routername": "S1",
"installed": "1",
"provisioned": "1",
"delata": "2",
"maximum": "2"
},
{
"routername": "S2",
"installed": "1",
"provisioned": "2",
"delata": "2",
"maximum": "2"
}
]
},
{
"locationname": "Honkong",
"routers": [
{
"routername": "H1",
"installed": "1",
"provisioned": "8",
"delata": "6",
"maximum": "9"
},
{
"routername": "Hungeri",
"installed": "1",
"provisioned": "6",
"delata": "5",
"maximum": "9"
}
]
}
]
},
{
"regionName": "India",
"locations": [
{
"locationname": "Banglore",
"routers": [
{
"routername": "T1",
"installed": "1",
"provisioned": "9",
"delata": "5",
"maximum": "4"
},
{
"routername": "T2",
"installed": "1",
"provisioned": "6",
"delata": "5",
"maximum": "9"
}
]
},
{
"locationname": "Mumbai",
"routers": [
{
"routername": "M1",
"installed": "1",
"provisioned": "6",
"delata": "6",
"maximum": "9"
},
{
"routername": "M2",
"installed": "1",
"provisioned": "6",
"delata": "5",
"maximum": "9"
}
]
}
]
}
]
这就是我尝试过的
<table>
<thead>
<th> Regions </th>
<th> Location </th>
<th> Routers </th>
</thead>
<tbody ng-repeat="regions in finalJson">
<tr ng-repeat-start="tempLocation in regions.locations"> </tr>
<tr>
<td rowspan=""4>{{regions.regionName}}</td>
<td rowspan="2">
<table>
<tbody>
<tr ng-repeat-start="location in regions.locations">
<td> {{location.locationname}}</td>
</tr>
<tr ng-repeat-end></tr>
</tbody>
</table>
</td>
<td >
<table>
<tbody ng-repeat="router in tempLocation.routers">
<tr>
<td>{{router.routername}}</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr ng-repeat-end></tr>
</tbody>
</table>
这里有一个小样帮你
<table id="customers">
<thead>
</thead>
<tbody>
<tr>
<th> Regions </th>
<th> Location </th>
<th> Routers </th>
</tr>
<tr ng-repeat="data in dataList">
<td>{{data.regionName}}</td>
<td>
<table>
<tr ng-repeat="location in data.locations">
<td>{{location.locationname}}</td>
</tr>
</table>
</td>
<td>
<table>
<tr ng-repeat="location in data.locations">
<td>
<table>
<tr ng-repeat="route in location.routers">
<td>{{route.routername}}</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
只需检查css样式,使其看起来与您在代码中看到的样式相似。还要看看是否div
有比更好的选择table
,取决于您
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句