AngularJS with bootstrap 3 accordion not working when included via ng-view AngularJS with bootstrap 3 accordion not working when included via ng-view angularjs angularjs

AngularJS with bootstrap 3 accordion not working when included via ng-view


Actually, there might be a simpler solution.

You can just make sure that the links don't propagate the URL change.

Add to the a tag onclick="return false;"


You can empty the href="" and use

data-target="#collapse" instead, this worked for me

i.e

<a data-toggle="collapse" data-parent="#accordion" href="" data-target="#collapse1">Collapsible Group 1</a>


The problem is that Bootstrap appends #according_name within a a tag. This triggers a AngularJS routing and due to route change test.html is loaded again on every click on accordian link.

Your options are to try to configure $locationProvider to use HTML5 mode with hashbag if it works

$locationProvider.html5Mode(true).hashPrefix('!');

See some documentation here

Other would be to use angular-ui component but it has been not ported to support version 3 of bootstrap.