Bootstrap's tabs with data-toggle cause reload in angularjs
The solution is as simple as replacing href attribute with data-target. That solves the issue:
<li><a data-target="#additionalSelection" data-toggle="tab">Additional Selection</a></li>
As dragonfly pointed out, data-target works fine instead of href.
There is a small difference in CSS. When data-target is used vs href, the cursor is not a pointer anymore. If you don't want to add extra CSS, you can do the following:
<a href="#additionalSelection" data-toggle="tab" onclick="return false;">Selection</a>This is just a suggestion, not an elegant solution. But if you want to use href for some reason, add
onclick="return false;"
Simply replace href attribute from data-target
<li><a data-target="#switchTabs" data-toggle="tab">Tabs</a></li>