Angularjs 链角重复

是否有一种方法可以根据对象中某个级别（两个以上）的数据量重复表中的行

比如：

<table>
   <tr ng-repeat="(key2, values) in list where list in (key1, list) in mydata">
      <td rowspan="6" ng-if="$parent.$first">{{key1}}</td>
      <td rowspan="3" ng-if="$first">{{key2}}</td>
      <td ng-repeat="value in values">{{value}}</td>
   <tr>
</table>

<table>
   <tr><th>Title</th><th>Subtitle</th><th>Value</th></tr>
   <tr ng-repeat-start="(subtitle, things) in mydata">
      <td rowspan="8" ng-if="$first">{{subtitle}}</td>
   </tr>
   <tr ng-repeat="(thing, values) in things">
      <td rowspan="4" ng-if="$first">{{thing}}</td>
   </tr>
   <tr ng-repeat-end ng-repeat="value in values">
      <td>{{value}}</td>
   </tr>
</table>

我找到了一种方法，可以在两个级别上使用

标记在第一个级别上重复，在第二个级别上使用

重复，但这只适用于两个级别的数据。如果我有5个等级呢

近似

---

，但我希望将数据压缩到两行，而不是将整行（大部分为空）用于键。在该示例中，title和subtitle将

rowspan

覆盖col1和col2（）。

以类似以下内容结束：

<table>
   <tr ng-repeat="(key2, values) in list where list in (key1, list) in mydata">
      <td rowspan="6" ng-if="$parent.$first">{{key1}}</td>
      <td rowspan="3" ng-if="$first">{{key2}}</td>
      <td ng-repeat="value in values">{{value}}</td>
   <tr>
</table>

<table>
   <tr><th>Title</th><th>Subtitle</th><th>Value</th></tr>
   <tr ng-repeat-start="(subtitle, things) in mydata">
      <td rowspan="8" ng-if="$first">{{subtitle}}</td>
   </tr>
   <tr ng-repeat="(thing, values) in things">
      <td rowspan="4" ng-if="$first">{{thing}}</td>
   </tr>
   <tr ng-repeat-end ng-repeat="value in values">
      <td>{{value}}</td>
   </tr>
</table>

标题次标题值
{{副标题}
{{thing}}
{{value}}

---

但是，如果在CSS中用不同的颜色高亮显示其他每一行（因为现在有“隐藏”行），就会把事情弄得一团糟。

结果是：

<table>
   <tr ng-repeat="(key2, values) in list where list in (key1, list) in mydata">
      <td rowspan="6" ng-if="$parent.$first">{{key1}}</td>
      <td rowspan="3" ng-if="$first">{{key2}}</td>
      <td ng-repeat="value in values">{{value}}</td>
   <tr>
</table>

<table>
   <tr><th>Title</th><th>Subtitle</th><th>Value</th></tr>
   <tr ng-repeat-start="(subtitle, things) in mydata">
      <td rowspan="8" ng-if="$first">{{subtitle}}</td>
   </tr>
   <tr ng-repeat="(thing, values) in things">
      <td rowspan="4" ng-if="$first">{{thing}}</td>
   </tr>
   <tr ng-repeat-end ng-repeat="value in values">
      <td>{{value}}</td>
   </tr>
</table>

标题次标题值
{{副标题}
{{thing}}
{{value}}

---

但是，如果在CSS中用不同的颜色高亮显示其他每一行（因为现在有“隐藏”行），就会把事情搞砸。

我似乎无法回答自己的问题，但我发现我可以通过不在前x行中放入数据来折叠前x行，然后使用

ng repeat begin

和

ng repeat end

。我似乎无法回答自己的问题，但我发现，我可以通过不将数据放入前x行来折叠前x行，然后使用

ng repeat begin

和

ng repeat end

。无法真正让JSFIDLE使用angular，但代码如下：无法真正让JSFIDLE使用angular，但代码如下：