javascript - 如何在Angularjs中设计下表

我有一个JSON在链接中给定，我希望它显示在表中。我为此有各种选择，我可以成功地将它带到该表中，另外还有一列用于编辑和查看按钮。我在查看选项时遇到了困难。我希望特定的选定行应显示如下



我尝试了ngHandsontable，但是我面临的问题是我无法在上述合并的单元格中按我的意愿在精确的单元格中填充值，而且在我所需的表中每一行都有不同的实体。这是一张表，我希望有可能以我想要的方式在angularjs中显示它。

有人可以帮我解决这个问题吗

提前致谢

注意：


我试图将此表放在第一个表的下方，我为此表使用ng-show指令，因此仅当单击视图选项时，它才会在同一页面上打开
下表是16x4单元格的表图像，并且图表的rowpan = 4
图像的colspan = 2，图表的colspan = 4

最佳答案

示例：http://jsfiddle.net/kevalbhatt18/sjpyffd8/1/

我已经完成了基本功能。现在在表上应用CSS

<div ng-controller="MyCtrl">
    <div ng-repeat="line in parent">
        <div class="header">{{line.name}}</div>
        <table>
            <tr>
                <td ng-repeat="satellites in line.satellites">{{satellites.name}}
                    <div>{{satellites.image}}</div>
                </td>
            </tr>
            <tr>
                <td ng-repeat="continents in line.continents">{{continents.name}}
                    <div>{{continents.image}}</div>
                </td>
                <tr/>
        </table>
             <div class="header">Population</div>
            <div>{{line.population.graph}}</div>
    </div>
</div>