按小数点分组表格单元格

Question

根据小数点对表格单元格进行分组。

Plunker

示例 JSON：

[
    {
        "data1": [
            {
                "name": "Download",
                "id": "1.1.1"
            },
            {
                "name": "Download",
                "id": "1.1.2"
            },
            {
                "name": "Download",
                "id": "1.2"
            },
            {
                "name": "Download",
                "id": "1.3"
            },
            {
                "name": "Download",
                "id": "1.4"
            }
        ]
    },
    {
        "data2": [
            {
                "name": "Download",
                "id": "2.1"
            },
            {
                "name": "Download",
                "id": "2.2"
            }
        ]
    },
    {
        "data3": [
            {
                "name": "Download",
                "id": "3.1.1"
            },
            {
                "name": "Download",
                "id": "3.1.2"
            },
            {
                "name": "Download",
                "id": "3.2"
            }
        ]
    },
    {
        "data4": [
            {
                "name": "Download",
                "id": "4.1.1"
            },
            {
                "name": "Download",
                "id": "4.1.2"
            }
        ]
    }
]

HTML：

<table border="0" class="table table-bordered">
    <tbody ng-repeat="(key,result) in results">
    <tr ng-repeat="r in result['data'+[key+1]]">
        <td rowspan="5">{{r.id}}</td>
    </tr>
    </tbody>
</table>

使用 ng-repeat 在表格的单个单元格中显示每个 id。

实际结果：

预期结果

由于 ng-repeat 单元格彼此相邻显示。预期结果是使用小数点除表格单元格。

示例：

Row1 => 1.1.1, 1.1.2, 1.2, 1.3, 1.4

Row2 => 2.1, 2.2

第 2 行的第一个单元格 (2.1) 应采用第 1 行的宽度（1.1.1 和 1.1.2）。而 2.2 应该占据 1.2、1.3 和 1.4 的其余宽度

提前致谢。

Answer 1

您的数据结构不清楚，似乎需要对其进行审查和重构。 但现在这个 plunker 可以帮助你。 （我希望！）

link:

plunker