Javascript AngularJS-我需要一个手风琴，可以同时打开多个面板

我有这个指令，可以选择一次打开一个面板，我需要修改这个行为，并给用户多个面板打开的选项

下面您将看到与我的相同的代码

指令（“BTSTACCRDION”，函数（）{ 返回{ 限制：“E”， 是的， 替换：正确， 作用域：{}， 模板： "", 链接：函数（范围、元素、属性）{ //给这个元素一个唯一的id var id=element.attr（“id”）； 如果（！id）{ id=“btst acc”+范围$id； 元素属性（“id”，id）； } //在手风琴切换元素上设置数据父级 var arr=element.find（“.accordion toggle”）； 对于（变量i=0；i

---

我能做什么？

您只需要删除属性（）：

/。。。
//在手风琴切换元素上设置数据父级
var arr=element.find（“.accordion toggle”）；
对于（变量i=0；i//$（arr[i]）.attr（“数据父项”，“#”+id）；您只需要删除属性（）：

/。。。
//在手风琴切换元素上设置数据父级
var arr=element.find（“.accordion toggle”）；
对于（变量i=0；i

评论这一行：

//$(arr[i]).attr("data-parent", "#" + id);

这个


评论这一行：

//$(arr[i]).attr("data-parent", "#" + id);

这个问题IMO是一个不使用angular well的完美例子。我建议删除整个指令和jQuery，因为它们对于简单的手风琴是不必要的（即angular非常适合这种类型的ui）。下面是一个更新版本：


现在，我将它保留得尽可能详细，以便您可以选择如何对其进行抽象（例如，使用ng repeat和ng include混合）。我还将依赖项保留在库中，以便保留样式，但这些样式也不难获取

下面是如何创建此功能的基本示例。div结构和类只剩下与jQuery对象匹配的部分

<div class="accordion" ng-controller="AccordionCtrl">
    <div class="accordion-group">
        <div class="accordion-heading">
            <a class="accordion-toggle" ng-click="toggle('a')">test</a>
        </div>
        <div class="accordion-body">
            <div class="accordion-inner" ng-show="show.a">
                <div>Anim pariatur cliche reprehenderit, enim eiusmod high life 
            accusamus terry richardson ad squid. 3 wolf moon officia aute,
            non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
            laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird
            on it squid single-origin coffee nulla assumenda shoreditch et.
            Nihil anim keffiyeh helvetica, craft beer labore wes anderson 
            cred nesciunt sapiente ea proident. Ad vegan excepteur butcher
            vice lomo. Leggings occaecat craft beer farm-to-table, raw 
            denim aesthetic synth nesciunt you probably haven't heard of 
            them accusamus labore sustainable VHS.</div>
            </div>
        </div>
    </div>
</div>

这个问题IMO是一个不使用angular well的完美例子。我建议删除整个指令和jQuery，因为它们对于简单的手风琴是不必要的（即angular非常适合这种类型的ui）。下面是一个更新版本：


现在，我将它保留得尽可能详细，以便您可以选择如何对其进行抽象（例如，使用ng repeat和ng include混合）。我还将依赖项保留在库中，以便保留样式，但这些样式也不难获取

下面是如何创建此功能的基本示例。div结构和类只剩下与jQuery对象匹配的部分

<div class="accordion" ng-controller="AccordionCtrl">
    <div class="accordion-group">
        <div class="accordion-heading">
            <a class="accordion-toggle" ng-click="toggle('a')">test</a>
        </div>
        <div class="accordion-body">
            <div class="accordion-inner" ng-show="show.a">
                <div>Anim pariatur cliche reprehenderit, enim eiusmod high life 
            accusamus terry richardson ad squid. 3 wolf moon officia aute,
            non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
            laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird
            on it squid single-origin coffee nulla assumenda shoreditch et.
            Nihil anim keffiyeh helvetica, craft beer labore wes anderson 
            cred nesciunt sapiente ea proident. Ad vegan excepteur butcher
            vice lomo. Leggings occaecat craft beer farm-to-table, raw 
            denim aesthetic synth nesciunt you probably haven't heard of 
            them accusamus labore sustainable VHS.</div>
            </div>
        </div>
    </div>
</div>

嘿@Matt Way太好了，我使用了一个Angular Strap插件，但是没有人回答我的问题。我不得不删除这个插件，但是无论如何，你能帮我检查一下吗？好的@Matt Way这里的问题是，我正在做的是与NodeJS（Sails）一起工作所以我需要动态地做。我一直在尝试在Fiddle或Plunkr上做一个例子，但我不知道为什么我不能。如果我把我的代码放在这里，你能帮我吗？嘿@Matt Way很好，我使用了一个角带插件，但没有人回答我的问题，我不得不删除那个插件，但是无论如何，你能帮我检查一下吗@Matt Way这里的问题我现在做的是使用NodeJS（Sails），所以我需要动态地做。我一直试图在Fiddle或Plunkr上做一个例子，但我不知道为什么我不能。如果我把代码放在这里，你能帮我吗？
$scope.toggle = function(index) {
    $scope.show[index] = !$scope.show[index];
};