【发布时间】:2017-02-25 01:01:04
【问题描述】:
我在使用 bootstrap ui 折叠指令时遇到问题,它显示为默认打开,我需要在页面加载时折叠,我正在正确设置变量但仍然无法正常工作
这是我的部分代码:
aside class="col-md-3 leftSidebar separator-right" ng-controller="Collapse as vm">
<div class="row separator">
<div class="sidebarPosition">
<div class="leftSidebar__toggle">
<a class="mod" ng-click="vm.isCollapsedLeft = !vm.isCollapsedLeft"><span class="fa fa-bars"></span> Outline</a>
<ul uib-collapse="vm.isCollapsedLeft">
<li><a href="#scientific_abstract" du-smooth-scroll>Scientific Abstract</a></li>
<li><a href="#layperson_abstract" du-smooth-scroll>Layperson’s Abstract</a></li>
<li><a href="#introduction" du-smooth-scroll>Introduction</a></li>
<li><a href="#">Results</a></li>
<li><a href="#">Discussion</a></li>
<li><a href="#">Methods</a></li>
<li><a href="#">Additional Information</a></li>
<li><a href="#">Change History</a></li>
<li><a href="#">Acknowledgements</a></li>
<li><a href="#">Author Information</a></li>
<li><a href="#">Author Contributions</a></li>
</ul>
</div>
</div>
</div>
<div class="row leftSidebar__sections">
<ul>
<li><a ui-sref="article.figures"><span class="fa fa-picture-o"></span> Figures</a></li>
<li><a ui-sref="article.references"><span class="fa fa-link"></span> References</a></li>
<li><a href="#"><span class="fa fa-retweet"></span> Related</a></li>
<li>
<a href="#"> <span class="fa fa-area-chart"></span> Stats Impact</a>
</li>
<li><a ui-sref="article.comments"><span class="fa fa-comment"></span> Comments</a></li>
</ul>
</div>
</aside>
我的控制器:
(function () {
'use strict';
angular
.module('app.bootstrap')
.controller('Collapse', Collapse);
function Collapse() {
var vm = this;
vm.isCollapsedLeft = false;
vm.isCollapsedRight = false;
}
})();
这是一个 plunkr:https://plnkr.co/edit/D0vFMEQe4a2GT1yJLTLk?p=preview
感谢您的帮助。
【问题讨论】:
-
plunkr 正在工作
标签: angularjs angular-ui-bootstrap