Question

我有一个如下手风琴。我遇到的问题是，如果我点击“第一节”，手风琴似乎会扩展，但实际上它会刷新页面而我无法将其折叠。如何让手风琴打开，但不会导致页面刷新？（我希望手风琴能够同时打开多个部分）

        <div class="accordion">
            <div class="accordion-group">
                <div class="accordion-heading">
                    <a class="accordion-toggle-small" data-toggle="collapse" data-parent="#accordianParent" href="#sectionOne" style="border-left: 3px solid red;padding-left:10px;">
                        Section One
                    </a>
                </div>
                <div id="sectionOne" class="accordion-body collapse">
                    <div class="accordion-inner-small">
                        Here is all the wonderful stuff in section ONE.<br>
                        <br>
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                    </div>
                </div>
            </div>
            <div class="accordion-group">
                <div class="accordion-heading">
                    <a class="accordion-toggle-small" data-toggle="collapse" data-parent="#accordianParent" href="#sectionTwo">
                        Section Two
                    </a>
                </div>
                <div id="sectionTwo" class="accordion-body collapse">
                    <div class="accordion-inner-small">
                        Here is all the wonderful stuff in section TWO.<br>
                        <br>
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                    </div>
                </div>
            </div>

Answer 1

您使用的是Bootstrap手风琴，手风琴中的href链接未被Angular拦截，因此整页加载。

我建议您查看UI Bootstrap或Angularstrap手风琴。或者查看bootstrap文档以查找是否可以在没有href的情况下支持该行为。

如何在角度使用手风琴？

1 个答案: