在角度中切換div

如何在Angular.JS中進行切換，以便再次單擊同一個div時div會打開和關閉。現在它執行動作以打開div，但每當我再次點擊它時，div都需要再次關閉。在角度中切換div

<a ng-href ng-click="openAccordionRow(champion.clean)"> Zerg </a>

，這將打開：

<div ng-show="isAccordionOpen(champion.clean)"> 
    info 
</div>

JS：

$scope.activeRows = ""; 
    $scope.isAccordionOpen = function(row) { 
    if ($scope.activeRows === row) { 
     return true; 
    } else { 
     return false; 
    } 
    } 

    $scope.openAccordionRow = function(row) { 
    $scope.activeRows = row; 
    }

這裏的問題是，再次按下它時一樣點擊DIV不會關閉。

來源

2015-04-26 Frenck

的方式，爲什麼會呢？您在點擊時將其設置爲活動狀態，並顯示活動行。再次點擊它不會設置它不活動，除非你改變了你的代碼 – mkoryak

爲什麼重新發明輪子...你有沒有考慮使用像ui-bootstrap：https://angular-ui.github.io/bootstrap/#/accordion –

爲此添加bootstrap看起來有點像矯枉過正？ – Frenck

當前您的代碼中沒有任何內容甚至試圖摺疊該行。你可以改變你的代碼。

HTML：

<a ng-href ng-click="toggleAccordionRow(champion.clean)"> Zerg </a>

的JavaScript：

$scope.activeRows = ""; 
    $scope.isAccordionOpen = function(row) { 
    if ($scope.activeRows === row) { 
     return true; 
    } else { 
     return false; 
    } 
    } 

    $scope.toggleAccordionRow = function(row) { 
    $scope.activeRows = $scope.isAccordionOpen(row) ? "" : row; 
    }

來源

2015-04-26 03:31:11

如果你想切換。只需使用這些代碼。

$scope.activeRows = true // Am setting this for default to show 
ng-click="$scope.activeRows = !$scope.activeRows" // change ng-click event 
ng-show = "$scope.activeRows" // bind directly $scope.activeRows to show.

來源

2015-04-26 03:29:17

只會有一個可摺疊元素，但不會再有效。你把'activeRows'改成了一個布爾值 – charlietfl

最簡單的方式做這樣的事情是波紋管

<a ng-href ng-click="hideBar =!hideBar"> Zerg </a> 

<div ng-show="hideBar"> 
    info 
</div>

來源

2015-04-26 03:36:30

在角度中切換div

回答

相關問題