擴展桌子AngularJS

Question

這裏是我的代碼：

<tbody> 
     <tr ng-repeat-start="person in people"> 
     <td> 
      <button ng-if="person.expanded" ng-click="person.expanded = false">-</button> 
      <button ng-if="!person.expanded" ng-click="person.expanded = true">+</button> 
     </td> 

     <td>{{person.name}}</td> 
     <td>{{person.gender}}</td> 
     <td> 
      <button ng-if="person.expanding" ng-click="person.expanding = false">-</button> 
      <button ng-if="!person.expanding" ng-click="person.expanding = true">+</button> 
     </td> 
     </tr> 
     <tr ng-if="person.expanded" ng-repeat-end=""> 
     <td colspan="3">{{person.details}}</td> 
     </tr> 
     <tr ng-if="person.expanding" ng-repeat-end=""> 
     <td colspan="3">{{person.gender}}</td> 
     </tr> 
    </tbody> 

第一功能ng-if="person.expanded" ng-click="person.expanded = false"作品，但第二不行。它是通過多重ng-repeat-end嗎？ Plunker：http://plnkr.co/edit/g1t4pludTTIAJYKTToCK?p=preview +在左側工作，右側沒有。 感謝您提前給出答案！

Answer 1

你必須把只有一個NG-重複結束在最後tr元素

更新的代碼：

<tbody> 
    <tr ng-repeat-start="person in people"> 
    <td> 
     <button ng-if="person.expanded" ng-click="person.expanded = false">-</button> 
     <button ng-if="!person.expanded" ng-click="person.expanded = true">+</button> 
    </td> 

    <td>{{person.name}}</td> 
    <td>{{person.gender}}</td> 
    <td> 
     <button ng-if="person.expanding" ng-click="person.expanding = false">-</button> 
     <button ng-if="!person.expanding" ng-click="person.expanding = true">+</button> 
    </td> 
    </tr> 
    <tr ng-if="person.expanded"> 
    <td colspan="3">{{person.details}}</td> 
    </tr> 
    <tr ng-if="person.expanding" ng-repeat-end=""> 
    <td colspan="3">{{person.gender}}</td> 
    </tr> 
</tbody>