我正在尝试在我的角度应用程序中包括以下Bootstrap可折叠面板。但是,当我单击“展开”时,似乎可以看到角度href="#collapseOne",然后将其重定向到主页,而不是折叠面板。我的路由看起来像这样,我认为otherwise({redirectTo:'/home'});是引起问题的原因。有什么建议?
href="#collapseOne"
otherwise({redirectTo:'/home'});
angular.module('App') .config(['$routeProvider', function($routeProvider) { $routeProvider. when('/users', {templateUrl: 'partials/users/user-list.html', controller: 'UserCtrl'}). when('/users/new', {templateUrl: 'partials/users/user-new.html', controller: 'UserNewCtrl'}). when('/users/:userid', {templateUrl: 'partials/users/user-detail.html', controller: 'UserDetailCtrl'}). otherwise({redirectTo: '/home'}); }]);
面板-
<div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> Expand </a> </h4> </div> <div id="collapseOne" class="panel-collapse collapse in"> <div class="panel-body"> ... </div> </div> </div> </div>
作为一个类似的问题mentionned,简单地由数据目标属性改变您的href
<div class="panel-group" id="accordion"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a href="javascript:;" data-toggle="collapse" data-parent="#accordion" data-target="#collapseOne"> Expand </a> </h4> </div> <div id="collapseOne" class="panel-collapse collapse in"> <div class="panel-body"> ... </div> </div> </div> </div>