javascript - angularjs1.6.1路由不正确
本文介绍了javascript - angularjs1.6.1路由不正确的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
在使用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('');
}]);
解决方案
你试试 #!/checkout
。貌似从1.6开始,路由都加了个前缀,默认是 !
。
这篇关于javascript - angularjs1.6.1路由不正确的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文