我使用角度bootstrap ui 0.14.3。
当我点击任何动态生成的手风琴时,它们全部打开/关闭。这里有点不对劲。
我只想要那个我点击打开/关闭的那个。
我已经设置了close-others =" true"但那不起作用......
我错了什么?
HTML :
<uib-accordion close-others="true">
<uib-accordion-group is-open="status.isFirstOpen" ng-repeat="t in tests">
<uib-accordion-heading>
{{t.schoolclassCode}}
<span style="background:orange;">{{t.type}}</span>
<span style="background:green;">{{t.number}}</span>
<span style="background:aliceblue;">{{t.date}}</span>
<i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': status.isFirstOpen, 'glyphicon-chevron-right': !status.isFirstOpen}"></i>
</uib-accordion-heading>
My dynamic content
</uib-accordion-group>
</uib-accordion>
控制器:
function TestsController($scope, tests) {
$scope.tests = tests;
$scope.oneAtATime = true;
$scope.status = {
isFirstOpen: true,
isFirstDisabled: false
};
}
答案 0 :(得分:3)
这是因为您的is-open="status.isFirstOpen"
与uib-accordion-group
中的变量相同。当您打开或关闭其中一个手风琴时,其他人正在观看相同的变量并将执行相同的操作。您必须使用数组才能为每个手风琴组定义一个唯一变量。我给你做了一个例子here。
<uib-accordion close-others="false">
<uib-accordion-group ng-repeat="group in groups track by $index" is-open="accordionArray[$index]">
<uib-accordion-heading>
{{group.title}}
<i class="pull-right glyphicon" ng-class="accordionArray[$index] ? 'glyphicon-chevron-down':'glyphicon-chevron-right'"></i>
</uib-accordion-heading>
{{group.content}}
</uib-accordion-group>
这在控制器$scope.accordionArray = []