2016-10-19 61 views
3

我正在嘗試在表格中製作可展開的行。我沒有收到任何錯誤消息,但它沒有按預期工作。我懷疑我在這裏使用ng-show的表達方式有什麼問題? plunker如何在ng-click和ng-show中使用表達式

我的代碼:

<table class='table'> 
    <thead> 
     <tr> 
     <th>name</th> 
     <th>itemOne</th> 
     <th>itemTwo</th> 
     </tr> 
    </thead> 
    <tbody ng-repeat="data in tableData| orderBy:'-clintonValuemain'"> 
     <tr> 
     <td> 
      <button ng-show="data.expand" ng-click='data.expand = true'>+</button> 
      <button ng-show="!data.expand" ng-click='data.expand = false'>-</button> 
      <input type="checkbox" class='checkbox'> 
      <a rel="noopener" target="_blank" href={{data.url}}> 
     {{data.name}} 
     </a> 
     </td> 
     <td>{{data.valueMain}}</td> 
     <td>{{data.tValue}}</td> 
     <tr> 
      <tr ng-show="data.expand" ng-repeat="subs in data.subvalues| orderBy:'-clintonValuesub'" > 
      <td> 
       {{subs.name}} 
      </td> 
      <td> 
       {{subs.valueSub}} 
      </td> 
      <td> 
       {{subs.tValue}} 
      </td> 
      </tr> 
     </tr> 

     </tr> 
    </tbody> 
    </table> 

回答

3

嘗試了這一點

<button ng-show="data.expand" ng-click='data.expand = false'>-</button> 
<button ng-show="!data.expand" ng-click='data.expand = true'>+</button> 

更新plunker

https://plnkr.co/edit/sJDFAp1KDvhYh8K3q7z2?p=preview

+0

這個效果很好! –

+0

是的,這要感謝Pandiyan – Imi

相關問題