AngularJS在带有排序过滤器的HTML表格元素中的ng-repeat（键，值）对数据结构中嵌套了ng-repeat

Question

我想从闲置数据结构中打印表格行。

$scope.myData = {}
myData['Item1']['Period1']= {"Value":1} 
myData['Item1']['Period2']= {"Value":2} 
myData['Item1']['Period3']= {"Value":3} 
myData['Item1']['Period4']= {"Value":4} 
myData['Item2']['Period1']= {"Value":11} 
myData['Item2']['Period2']= {"Value":12} 
myData['Item3']['Period3']= {"Value":13} 
myData['Item4']['Period4']= {"Value":14} 

我想以某种方式打印它并按期间名称 DESC 排序：

<tbody >
    <tr ng-repeat="(key, value) in myData">
        <td>
            {{ key }}
        </td>
        <td ng-repeat="PeriodItem in value | <!-- here the filtering -->">
          {{ PeriodItem.Value }}
        </td>
    </tr>
</tbody>

键被打印出来，但 PeriodItem.Value 不是。这样做的正确方法是什么，因为我尝试了几件事，但似乎都没有工作。

所需输出示例：

<tbody>
    <tr>
        <td>Item1</td>
        <td>4</td>
        <td>3</td>
        <td>2</td>
        <td>1</td>
    </tr>
    <tr>
        <td>Item2</td>
        <td>14</td>
        <td>13</td>
        <td>12</td>
        <td>11</td>
    </tr>
</tbody>

Answer 1

试试这个fiddle

  <tbody >
        <tr ng-repeat="(key, value) in myData">
            <td>
                {{ key }}
            </td>
            <td ng-repeat="(key, value) in value">
              {{ value.Value }}
            </td>
        </tr>
    </tbody>

Answer 2

当使用 ng-repeat 时，“(key, value) in blah”语法用于迭代哈希。

"value in blah" 用于迭代数组

您已将数据定义为

myData['Item1']['Period1']= {"Value":1}
myData['Item1']['Period2']= {"Value":2} 
...

这有点令人困惑。如果重构的话，应该清楚第二维是数组还是散列。

$scope.myData = {
    Item1: {
              Period1: {Value: 1},
              Period2: {Value: 2},
              Period3: {Value: 3},
              Period4: {Value: 4},
           },
    Item2: {
              Period1: {Value: 11},
              Period2: {Value: 22},
    ...