带有数据切换的Bootstrap选项卡会导致以angularjs的forms重新加载

我刚刚迁移到AngularJS 1.2。而且我意识到，所有configuration了数据切换的菜单/导航元素，例如：

<li><a href="#additionalSelection" data-toggle="tab">Additional Selection</a></li>

不再工作了。他们应该用id =“additionalSelection”切换元素 – 这就是当我使用Angular 1.0.8版本时Angular＆Bootstrap的工作原理。

但是现在，当我点击锚点元素时，Angular截获了这个点击并尝试去路由additionalSelection并且导致页面刷新…

有没有办法解决它？

解决scheme就像用data-targetreplacehref属性一样简单。解决了这个问题：

 <li><a data-target="#additionalSelection" data-toggle="tab">Additional Selection</a></li>

正如dragonfly指出的， data-target工作正常，而不是href 。

CSS有一个小的差异。当使用数据目标 vs href时 ，游标不再是指针。如果您不想添加额外的CSS，则可以执行以下操作：

 <a href="#additionalSelection" data-toggle="tab" onclick="return false;">Selection</a>

这只是一个build议，而不是一个优雅的解决scheme。但是，如果你想使用href出于某种原因，添加onclick="return false;"

只需从data-targetreplacehref属性即可

 <li><a data-target="#switchTabs" data-toggle="tab">Tabs</a></li>

保留游标的解决scheme（仍然依靠数据目标而不是href来导航）是：

 <li><a href="" data-target="#additionalSelection" data-toggle="tab">Additional Selection</a></li>

添加href会导致光标切换到手，但保留空白为“”不会导致任何页面重新加载。