AngularJS与引导标签

我使用的是JavaScript的引导3个标签的记录，像这样互相矛盾：AngularJS与引导标签

<!-- Nav tabs --> 
<ul class="nav nav-tabs" role="tablist"> 
    <li class="active"><a href="#home" role="tab" data-toggle="tab">Home</a></li> 
    <li><a href="#profile" role="tab" data-toggle="tab">Profile</a></li> 
    <li><a href="#messages" role="tab" data-toggle="tab">Messages</a></li> 
    <li><a href="#settings" role="tab" data-toggle="tab">Settings</a></li> 
</ul> 

<!-- Tab panes --> 
<div class="tab-content"> 
    <div class="tab-pane active" id="home">...</div> 
    <div class="tab-pane" id="profile">...</div> 
    <div class="tab-pane" id="messages">...</div> 
    <div class="tab-pane" id="settings">...</div> 
</div>

但随着角，它的网址更改为例如/＃/ profile文件..

我该如何预防？

来源

2014-09-28 Billy Assim

你使用Angular的路由吗？ – 2014-09-28 00:33:18

是的，routeProvider – 2014-09-28 00:34:07

旁边的问题：如果你使用的是Angular，而且你也使用bootstrap，为什么不使用angular bootstrap（http://angular-ui.github.io/bootstrap/）？ – Blaskovicz 2014-09-28 00:37:22

在某一点上，如果某个链接设置了_target属性，则角度将不会拦截这些点击。也许这会在这种情况下工作？

来源

2014-09-28 00:35:41 Blaskovicz

工作将在5分钟内接受答案。 – 2014-09-28 00:36:42

加入target =“_ self”完美运作。感谢 – 2016-04-02 05:41:11

可怕，但它的工作！ – 2017-03-25 16:45:08

只要把data-target而不是href属性，它会工作，而无需更改网址。

来源

2014-09-28 13:15:34 mgalic

我在使用wordpress主题时遇到了类似的问题。我使用引导程序将href用于标签式导航。这个答案帮助了我。我将href改为数据目标，并使标签导航工作。像魅力一样工作.. – 2014-12-18 17:31:35

Angular正在拦截我在引导程序导航标签上设置的#hrefs。将href属性更改为data-target为我修复了它！感谢mgalic！（虽然它让我感到有些迷茫，现在我已经有标签没有href属性：/哦） – Jupo 2015-03-05 07:58:41

伟大的解决方案。 @Jupo：如果你想在那里有hrefs，以便鼠标光标有正确的样式，你仍然可以。只需为href设置一个空值，然后使用数据目标来执行实际的导航。有关更多信息，请参阅https://docs.angularjs.org/api/ng/directive/a。 – pbuchheit 2015-05-12 12:47:51

AngularJS与引导标签

回答

相关问题