angularjs1.6.1路由不正确

发布于 2022-09-04 11:30:32 字数 1386 浏览 15 评论 0

在使用angular-route设置路由时,页面href不正确,如下:

[app.html]
...
<custom />
...
<script>
...
app.config(["$routeProvider", function ($routeProvider) {
    $routeProvider.when("/checkout", {
        templateUrl: "views/checkoutSummary.html",
    });

    $routeProvider.when("/products", {
        templateUrl: "views/productList.html"
    });

    $routeProvider.otherwise({
        templateUrl: "/views/productList.html",
    })
}])
...
</script>

custom指令引入模版如下(由于只有路由有问题,这里的代码不包含没有问题的代码):

<div class="navbar-right">
    <div class="navbar-text">
        <b>购物车:</b>
        {{itemCount()}} 个商品,
        {{total() | currency}}
    </div>
    <a href="#/checkout" class="btn btn-default navbar-btn">结算</a>
</div>

点击a元素时,浏览器路径显示为:

http://localhost:3000/app.html#!#%2Fcheckout

错误路径取到的$location.hash()"/checkout"

正确的路径应为:

http://localhost:3000/app.html#!/checkout
或者
http://localhost:3000/app.html#!%2Fcheckout

请问是什么原因,导致点击链接的时候自动给多加了一个#在!后面?


已有解决方案,一种是一楼的回答,路径写为#!/checkout

另一种是修改hashprefix,也就是路由标签模式下默认的前缀!符号

app.config(['$locationProvider', function($locationProvider) {
  $locationProvider.hashPrefix('');
}]);

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

临走之时 2022-09-11 11:30:32

你试试 #!/checkout 。貌似从1.6开始,路由都加了个前缀,默认是 !

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文