表展開和摺疊不工作在角度js

下面是表格結構擴展&崩潰，我已經完成使用表。現在我已經使用下面的腳本進行摺疊&展開。但有時我成功地擴大&有時不。表展開和摺疊不工作在角度js

我做什麼，當我得到了來自API響應，我調用這個函數：

$timeout(function(){ 
        $scope.initExpandCollapse(); 
       },1000); 


$scope.initExpandCollapse = function() { 
     angular.element(document).on("click", ".table_exp", function(){ 
      var TBODY = angular.element(this).parents(3); 
     if(TBODY.hasClass("open")){ 
      TBODY.children("tr.expand-table-row").hide(); 
      TBODY.removeClass("open"); 
      return false; 
     } 
     TBODY.addClass("open"); 
     TBODY.children("tr.expand-table-row").show(); 
    }); 
}

如果你們可以幫助我這個問題。謝謝。

來源

2016-02-24 rroxysam

爲什麼你使用超時？ –

使用angular，你確實不應該像你那樣操作DOM，而是用'ng-class'有條件地設置類。 –

@johannes，任何建議我怎麼能實現它。？ – rroxysam

CSS：

tr.expand-table-row { 
    display: none; 
} 

tr.expand-table-row.open { 
    display: initial; 
}

角

$scope.expandCollapse = function expandCollapse (item) { 
    item.open = !item.open 
}

HTML

<table> 
    <tbody> 
    <tr ng-repeat="item in items track by $index""> 
     <td ng-click="expandCollapse(item)">++++</td> 
     <td> 
      <table> 
      <tr ng-class="{'open': item.open}" class="expand-table-row open"> 
       <td>{{item.name}}</td> 
       <td ng-repeat="data in item.options">{{data.name}}</td> 
      </tr> 
      </table> 
     </td> 
    </tr> 
    </tbody> 
</table>

您需要嵌套的表格所以CLIC k標記不會簡單地與其餘部分一起消失，除了突出點是ng-class="{'open': item.open}" espression，如果設置了項目上的屬性open，則設置類別open。

來源

2016-02-24 19:23:23

@johnannes jander，謝謝你的回答。我認爲這是正確的方法。我爲你的代碼創建了一個plunkr。請在那邊查看並更正。 http://plnkr.co/edit/0Bo2KUx6jhQgnjGBdcCI?p=preview – rroxysam

你做了一個副本和過去的錯誤，我已經糾正它，並使其成爲一個嵌套表，所以單擊的行不會完全消失。看到這裏：http://plnkr.co/edit/CU4Q5MUoYhG7J7g4KP4B?p=preview –

@ johnannes，我根據我的要求及其對我的工作做了一些改變。感謝+1的答案。 – rroxysam

嘗試使用window.onload而不是$timeout，或者將腳本添加到body標籤的末尾。

來源

2016-02-24 19:20:12

表展開和摺疊不工作在角度js

回答

相關問題