angularjs - ng-repeat with boootstrap toggle strange behavior -


below code

<div class='loadmaindiv' ng-controller="loadcntrl">     <ul class='list-header' data-toggle="collapse" data-target='#{{schema.name}}' ng-repeat='schema in data'> {{schema.name}}         <!--   <li  data-toggle="collapse" data-target='#{{schema.name}}'>{{schema.name}}          </li> -->          <div id='{{schema.name}}' class="collapse in ">             <ul ng-repeat="schemaele in schema.value">                 <li class='list-item' ng-click='setselected(schemaele.name,$index)'><span ng-class="(selectedele==schemaele.name) ? 'selectedli' :''">{{schemaele.name+""}}</span></li>             </ul>         </div>     </ul> </div>  

this output getting

fruit

  • mango

  • banana

language

  • english

  • spanish

the behavior looking when click on fruit div should shrink , if click again should expand. happening correctly if click on individual sublist element getting same behaviour. strange me ? reason

    <div ng-repeat='schema in data'>     <div class='list-header' data-toggle="collapse" data-target='#{{schema.name}}'>         {{schema.name}}     </div>     <div id='{{schema.name}}' class="collapse in ">         <ul ng-repeat="schemaele in schema.value">             <li class='list-item' ng-click='setselected(schemaele.name,$index); event.preventdefault();'><span ng-class="(selectedele==schemaele.name) ? 'selectedli' :''">{{schemaele.name+""}}</span></li>         </ul>     </div> </div> 

Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -