问题
The problem is the following: As soon as I use the accordion in a view that is loaded in the ng-view directive, the accordion title clicks dont work correctly anymore
http://plnkr.co/edit/KGwuqDIb7I5NrYCtPOPk?p=preview
If the accordion is use in the page itself with no ng-view, the accordion works perfectly
http://plnkr.co/edit/8dY7JU1kxjZ2jAKmMIrP?p=preview
Any clue to what Im missing?
回答1:
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.
回答2:
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;"
回答3:
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>
回答4:
I was having an issue using href and data-target together, so if you are using this in an application I'd recommend specifying one or the other but not both.
When I used both, I'd get redirected to my login page as soon as I clicked on it. With one or the other specified it worked fine, but not with both.
来源：https://stackoverflow.com/questions/18803955/angularjs-with-bootstrap-3-accordion-not-working-when-included-via-ng-view