面板可折叠重新加载页面而不是隐藏面板| angularjs | bootstrap | NG-重复

时间:2013-11-27 12:07:02

标签: angularjs twitter-bootstrap

我对这段代码感到失望:

<div class=" col-md-3 col-lg-2 hidden-xs hidden-sm">
    <div class="panel-group" id="mainMenuCollapsible">
        <div ng-repeat="item in menuItems">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h4 class="panel-title">
                        <a data-toggle="collapse" data-parent="#mainMenuCollapsible" href="#collapse_{{ $index }}">
                            {{ item }}
                        </a>
                    </h4>
                </div>
                <div id="collapse_{{ $index }}" class="panel-collapse collapse" >
                    <div class="panel-body">
                        BLA BL
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

没有机会让这个工作。当我单击任何面板页面的标题重新加载时显示所选面板但没有视觉效果。我的代码与bootstrap example完全相同。

我把jss放在正确的位置(jquery 2.0.3,bootstrap.min 3.0.2,angular 1.2)。

我还尝试删除ng-repeat并使用单个面板进行操作而没有运气。我错过了什么? 非常感谢

1 个答案:

答案 0 :(得分:2)

解决了我的自我。它的角度是拦截路线#collapse_X。使用data-target而不是href:

data-target="#collapse_{{ $index }}"

完美解决了!

希望这有助于某人。