Question

我试图在我的应用中自定义折叠。我已经尝试过AngularJS UI Bootstrap附带的手风琴插件，但它相当复杂，因为我需要的是并排的2个链接，并且折叠元素连续打开，所以我已经决定在Bootstrap中包含transition.js和collapse.js。

到目前为止，我的代码看起来像这样：

<div class="logo" id="accordion">
      <a data-parent="#accordion" data-toggle="collapse" data-target="#login">
        Log In
      </a>

      <a data-parent="#accordion" data-toggle="collapse" data-target="#signup">
        Sign Up
      </a>

      <div id="signup" class="collapse">dfkñfkldsklñfdsñlkfd ñlkdflkfdñlfsdñl ksfdlkfdslñsfdñl kfdkfkldl fdksñlfdklfdñksfd

      <div id="login" class="collapse">blablabla</div>

</div>

崩溃效果完美无缺，但到目前为止，我还没有能够完成一次只打开一个项目＆＃34;影响。

可能与AngularJS文件存在某种冲突吗？

这里是working Plunker。

Answer 1

我认为简短的回答是你需要有两个变量loginCollapsed和signUpCollapsed并在控制器中自己管理互斥性。例如：

// untested
$scope.$watch('loginCollapsed', function(val){
  signUpCollapsed = !loginCollapsed;
})

有角度的人设置了一些好的练习并且有一个可选择打开一个或多个bellows的手风琴：

实施来源：

if ( closeOthers ) {
  angular.forEach(this.groups, function (group) {
    if ( group !== openGroup ) {
      group.isOpen = false;
    }
  });
}

https://github.com/angular-ui/bootstrap/blob/master/src/accordion/accordion.js#L13

折叠只有一个项目在AngularJS中打开不起作用

1 个答案: