2016-07-08 10 views
0

Ich sah einige kleinere Probleme in meinem kollabierbaren Menü. Ich möchte es umschalten. Aber es funktioniert nicht.Ionic Collapasable Ansicht toggle class issues

Ich teile meinen Quellcode.

Html

<div class="canCollapse canCollapse{{index}} hideBody"></div> 
    <div class="standardIcon" ng-click="collapse({{index}})"> 

    </div> 

Auf Schaltfläche anklickt // ----- Index Wertänderung gemäß Listenindex

$scope.collapse = function(index){ 
     document.querySelector('.canCollapse'+index).classList.toggle('hideBody') 
    } 

in Css

.hideBody .item-body{ 
    display: none; 
} 


.hideBody .ifClose{ 
    display: inline-block; 
} 

.hideBody .ifOpen{ 
    display: none; 
} 

bitte Team resolve mein Problem.

Antwort

0

Sie verstecken und zeigen jeden Inhalt wie diesem Code:

CSS:

.hideBody { 
    display: none; 
} 

HTML:

<div ng-init="isShow=false;" ng-class="{ 'hideBody': isShow }">Data to show</div> 
    <div class="standardIcon" ng-click="isShow = !isShow; ">click </div>