Bootstrap 4 导航：防止 URL 切换和刷新

Question

我正在使用 Bootstrap 4 和 AngularJS 创建一个应用程序。我需要使用一个模态，其中我使用 Bootstrap 4 中的导航。我不喜欢的是，导航使用的是附加到地址栏中 url 的一些 href。问题是 angular 模块有

$rootScope.$on('$locationChangeStart', function () {
...
});

并且我还将 $routeProvider 用于路由，如“/”、“/login”和“/register”。因此，每次我在模式中更改导航中的选项卡时，背景都会重新加载，这真的不太好，因为重新加载时会再次向服务器发出很多请求。

我试着做了一个简单的fiddle。如您所见，如果您更改导航选项卡，URL 会被修改（那里有一个 setInterval，请查看控制台）。 Fiddle: http://jsfiddle.net/pxbndo3z/1/

我该如何解决这个问题？

Answer 1

根据这里的回答：href causes unintended page reload with Angularjs and Twitter Bootstrap，我决定使用类似的东西：

onclick="(function(e){e.preventDefault();})(event)"

在导航标签的 hrefs 上。看来一切正常，所以我们开始吧！