Angularjs 角度JS在HTML表体中重新生成JSON

我有休闲数据结构：

var myDataStructure =


[
    {
        "Period": {
            "Name": "Period1",
        },
        "Data": {
            "Now": {
                "NowNames": [
                    {
                        "Value": "Name1"
                    },
                    {
                        "Value": "Name2"
                    },
                    {
                        "Value": "Name3"
                    }
                ],
                "LaterNames": [
                    {
                        "Value": "Name4"
                    },
                    {
                        "Value": "Name5"
                    },
                    {
                        "Value": "Name6"
                    }
                ],
            }
        }  
    },     
    {
        "Period": {
            "Name": "Period2",
        },
        "Data": {
            "Now": {
                "NowNames": [
                    {
                        "Value": "Name7"
                    },
                    {
                        "Value": "Name8"
                    },
                    {
                        "Value": "Name9"
                    }
                ],
                "LaterNames": [
                    {
                        "Value": "Name10"
                    },
                    {
                        "Value": "Name11"
                    },
                    {
                        "Value": "Name11"
                    }
                ],
            }
        }  
    }     
]

我想在一个表格主体中打印第一行，其中一个单元格包含两个期间的每个NowNames的名称值，然后再次打印行，其中一个单元格包含两个期间的每个LaterNames的名称值。用AngularJ做这件事的最好方法是什么？我在寻找正确的语法，因为首先我必须对每个周期执行一次循环，然后从周期开始。数据值我必须打印一行，其中包含来自NowNames等的值。类似于：

<tr ng-repeat="Period in myDataStructure">
    <tr ng-repeat="Item in Period.Data.Now.NowNames">
        <td>
            {{Item.Value}}
        </td>
    </tr>
    <tr ng-repeat="Item in Period.Data.Now.LaterNames">
        <td>
            {{Item.Value}}
        </td>
    </tr>
</tr>

{{Item.Value}}
{{Item.Value}}

但没有嵌套的tr，因为它无效且不起作用 预期结果：

<tbody>
    <tr>
        <td>
            Name1
        </td>
    </tr>
    <tr>
        <td>
            Name2
        </td>
    </tr>
    <tr>
        <td>
            Name3
        </td>
    </tr>
    <tr>
        <td>
            Name7
        </td>
    </tr>
    <tr>
        <td>
            Name8
        </td>
    </tr>
    <tr>
        <td>
            Name9
        </td>
    </tr>
    <!-- after that the same for LaterNames in the same order.... -->
</tbody>

名称1
姓名2
名字3
姓名7
姓名8
名字9

您可以通过使用嵌套ng repeat来实现这一点：

<table>
    <tbody ng-repeat="subdata in myDataStructure">
        <tr ng-repeat="nowName in subdata.Data.Now.NowNames">
            <td>{{nowName.Value}}</td>
        </tr>  
    </tbody>

    <tbody ng-repeat="subdata in myDataStructure">
        <tr ng-repeat="LaterName in subdata.Data.Now.LaterNames">
            <td>{{LaterName.Value}}</td>
        </tr>
    </tbody>
</table>

{{nowName.Value}
{{LaterName.Value}

请参见此处的工作演示：

---

也许这是一个更好的解决方案，准备控制器中已有的输出：读取JSON并创建一个新的JSON，该JSON的数据顺序正确。这将使输出更清晰。

是的，我正在寻找正确的语法…预期的html结果布局在哪里？请告诉我你是怎么想的我会马上修好的你需要这个只读列表吗？最简单的方法是映射到新的数组，但我需要将它放在一个表中，因为我给出的示例是简化的，因为我只需要正确的语法。不过，该表将具有一些功能。。。我可以使数据结构更简单，比如将其分散在作用域可用的单独变量中，并处理多个嵌套重复，但我想知道它是否可以立即发生，因为我从服务获得数据结构..是的。。。我想我会准备输出，因为它太复杂了，无法尝试创建这样的东西。。。