Question

我正在使用uibAccordion，其中切换不正确，如果我点击第一个重复元素，所有其他元素也会打以下是代码。

<ul>
    <li ng-repeat="(key, value) in scenariosViewAll.collectionBookObject">
        <div class="desc">
            <uib-accordion close-others="true" class="">                                                                                                                             
                <div uib-accordion-group id="{{$index+1}}" class="panel-default" is-open="status.open" is-disabled="true" prevent-click="false" ng-init="status.open = (key == scenariosViewAll.shared.currentSelectedAccordion) ? true : false" ng-class="{'opened': status.open}"  ng-if="value.length > 0">
                    <uib-accordion-heading>
                        <span class="accordion-toggle-wrapper">

                            <span class="accordion-title">
                                {{key}}
                            </span>
                            <span class="pull-right acc-icon-set">
                                <span class="collection-indicator">{{value.length}}</span>
                                   <span class="arrow-toggle">
                                       <button class="btn btn-icon" aria-hidden="true" ng-click="status.open = !status.open;">
                                          <i class="icon" ng-class="{'icon-chevron-up': status.open, 'icon-chevron-down': !status.open}"></i>
                                       </button>
                                   </span>
                               </span>
                           </span>
                    </uib-accordion-heading>
                </div>
            </uib-accordion>
        </div>
    </li>
</ul>

我已尝试将ID传递为{{index+1}}和close-others="true"。但它不起作用

Answer 1

下面

ng-init="status.open = (key == scenariosViewAll.shared.currentSelectedAccordion) ? true : false"

我真的不知道你绑定status.open的是什么，但显然这是错误的，而且非常含糊不清

简化它，并为is-open提供一个属性，该属性引用每个迭代键/值的不同值，例如

ng-init="value.ui.isOpen = false;"
is-open="value.ui.isOpen"

如果你是raelly lazy，并且不需要在你的控制器中访问这些变量，那就不要将它绑定到任何东西

ng-init="isOpen = false;" // by now this is redundant and can be removed
is-open="isOpen"

这将起作用，因为ngRepeat为每次迭代创建了一个新范围，因此每个范围都会创建一个新的isOpen。

Answer 2

我通过传递索引获得了解决方案：

  <div uib-accordion-group  class="panel-default"  ng-init="status.open = false;" is-open="status.open[$index]"  prevent-click="false"  ng-class="{'opened': status.open}"  ng-if="value.length > 0">

Uib手风琴切换问题

2 个答案: