如何在angular JS中生成rowspan

时间:2015-05-04 14:10:32

标签: javascript angularjs

也许有人可以帮助我解决一个问题,我实际上是想用像这样的Angular Js来生成A结构

<table>
  <tr>
    <th>Modo de transporte</th>
    <th>Estado del proyecto</th>
    <th>Proyecto</th>
  </tr>
  <tr>
    <td rowspan="6">Carretero</td>
    <td rowspan="2">Estructuración</td>
    <td>Proyecto 1</td>
  </tr>
  <tr>
    <td>Proyecto 2</td>
  </tr>
  <tr>
    <td rowspan="2">Contratación</td>
    <td>Proyecto 3</td>
  </tr>
  <tr>
    <td>Proyecto 4</td>
  </tr>
  <tr>
    <td rowspan="2">Gestion contractual</td>
    <td>Proyecto 5</td>
  </tr>
  <tr>
    <td>Proyecto 6</td>
  </tr>
  <tr>
    <td rowspan="4">Aeropuertos</td>
    <td>Estructuracion</td>
    <td>Proyecto 7</td>
  </tr>
  <tr>
    <td rowspan="2">Contratación</td>
    <td>Proyecto 8</td>
  </tr>
  <tr>
    <td>Proyecto 9</td>
  </tr>
  <tr>
    <td>Gestion contractual</td>
    <td>Proyecto 10</td>
  </tr>
</table>

但使用此.js代码

$scope.regional = {
distribution: {
  "Arauca": {
     modes: {
       "Aeropuertos": {
         status: {
           "Estructuracion": ["Nodo 1", "Nodo 2", "Nodo 3"],
           "Contratacion": ["Nodo 1", "Nodo 2"],
         },
         count: function(){
           var c = 0;
           for(var k in this.status){
             c += this.status[k].length;
           }
           return c;
         }
       }
     },
     count: function(){
       var c = 0;
       for(var m in this.modes){
         c += this.modes[m].count();
       }
       return c;
     }
   }
}
};
 
<table ng-repeat="(dpto, intodpto) in regional.distribution">
  <caption>{{dpto}}</caption>
  <tr>
    <th>Modo de transporte</th>
    <th>Estado del proyecto</th>
    <th>Proyecto</th>
  </tr>
  <tr ng-repeat-start="(mode, intomode) in intodpto.modes">
    <td rowspan="{{intomode.count()}}">{{mode}}</td>
  </tr> 
  <tr ng-repeat-start="(status, intostatus) in intomode.status">
    <td rowspan={{intostatus.length}}>{{status}}</td>
  </tr>
  <tr ng-repeat-end ng-repeat="proj in intostatus">
    <td>{{proj}}</td>
  </tr> 
  <tr ng-repeat-end></tr>
</table>`

我如何将它结合起来,我正在使用ng-repeat-start来执行js代码,非常感谢任何建议

0 个答案:

没有答案