Question

基本上目前我有html代码，它构建了面板的布局，我想基本上扩展和折叠这些面板，由于某些原因，当我加载资产并运行我的应用程序时，面板显示折叠但是当我点击时不会展开代码在下面的面板标题，我使用角度js与html5。如果有人可以帮忙，我会很感激。

<div class="row clearfix" >
    <div ng-repeat="i in ctrl.coreControlpanelItems" class="col-md-12 column" >
        <div ng-class="{'panel-primary': hover}" ng-mouseenter="hover = true" ng-mouseleave="hover = false"  class="panel panel-default animated fadeInUp">
            <div class="panel-heading">
                <i class="pull-left {{i.icon}}"/>
                <h5 class="panel-title">
                    <a href="#" ng-model="collapsed" ng-click="collapsed=!collapsed">
                    <a ui-sref="{{i.ref}}">{{i.group}}</a>
                    </a>        
                </h5>
            </div>
            <div ng-show="collapsed">
                <div class="panel-body ">
                    <ul>
                        <li ng-repeat="s in i.items"><a ui-sref="{{s.ref}}">{{s.name}}<a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
</div>

Answer 1

首先，您在a元素中嵌套了panel-title个标记。这是一个禁忌。

其次，您无法将ng-model放在a代码上。

第三，你的panel-title应该扩展一些东西，但你内部也有一个链接，如果点击它会否定你正在尝试用扩展做的事情......

在面板html 5.0上使用angular js collapse功能

1 个答案: