Question

下面是我的代码

<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>

这是我得到的输出

水果

芒果
香蕉

语言

英文
西班牙语

我正在寻找的行为是当我点击Fruit时，DIV应该缩小，如果再次点击它应该展开。这是正确发生的，但即使我点击单个子列表元素我得到相同的行为。对我来说很奇怪？可能是什么原因

Answer 1

    <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>

ng-repeat with boootstrap切换奇怪的行为

1 个答案: