我正在使用动态面板。我用过"collapse"按钮。问题是，折叠按钮仅适用于第一个面板

Question

我正在使用动态面板。现在，我已经对JS文件中的数据进行了硬编码。我使用了折叠按钮。问题是，折叠按钮仅适用于第一个面板。尽管折叠按钮出现在其他面板上，但它不起作用。

有人可以帮我吗？

此外，我还使用自定义指令来使用动态面板。

Answer 1

问题是您在数据目标中使用相同的 id。应考虑每个项目的唯一目标 ID 和目标。我建议使用$index ng-repeat，最好始终使用 track by 进行 ng-repeat，在您的案例中跟踪$index编辑的代码：

    <div class="text-center">
       <button type="button" class="btn btn-default collapsed" data-toggle="collapse" 
           data-target="#demo-{{$index}}">
        VIEW DETAILS
       </button>
    </div>
    <div id="demo-{{$index}}" class="collapse">
        Lorem ipsum 
    </div>

如果问题没有解决，请准备一个更具体的 plunker。