AngularJS路由+ .htacces重写+路由参数=不起作用 [英] AngularJS routes + .htacces rewriting + route Parameters = not working
问题描述
这实质上是这个问题由于未正确回答问题。
This essentially is a repost of this question Since the question wasn't correctly answered.
使用一组基本的自我解释性htaccess重写
Using a basic set of self explainatory htaccess rewrites
RewriteEngine on
# Don't rewrite files or directories
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
# Rewrite everything else to index.html to allow html5 state links
RewriteRule ^ index.html [L]
请考虑以下链接。
1. http://localhost/clouds
2. http://localhost/wind
3. http://localhost/city/Tokyo
页面刷新后,链接1和2可以正常工作,但是只能通过页面导航(单击链接)访问链接3。如果我在浏览器中手动设置第三个链接,则进入索引页面,这与链接1和2不同。
Links 1 and 2 are working fine upon page refresh but link 3 is only accessible through page navigation (clicking the link). If I manually pase the third link in the browser I get to the Index page, unlike link 1 and 2.
我的路线配置:
theApp.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
"use strict";
console.log('Configuring');
$routeProvider.when('/clouds', {
templateUrl: 'Views/Cloud.html',
controller: 'cloudController'
}).when('/wind', {
templateUrl: 'Views/Wind.html',
controller: 'windController'
}).when('/city/:cityName', {
templateUrl: 'Views/City.html',
controller: 'cityController'
});
$locationProvider.html5Mode(true);
}]);
P.S。我确实放了。如果我没有链接1和2,那么它们将无法正常工作。
P.S. I did put . If i hadn't link 1 and 2 wouldn't be working.
编辑:很糟糕,我没有添加指向这些链接的定位标记。
My bad I did not add the anchor tags leading to these links.
<ul class="nav navbar-nav navbar-right">
<li><a href="#"> Home</a></li>
<li><a href="/clouds"> Cloud</a></li>
<li><a href="/wind"> Wind</a></li>
<li><a href="/city/Tokyo"> CHAT!!!</a></li>
</ul>
推荐答案
您必须放置 < base href = / />
在标签的最上方。
可行,尽管我想知道如何和为什么!
You have to place the <base href="/" />
At the very top of the tag.
It works, although I would like to know HOW AND WHY!!
这篇关于AngularJS路由+ .htacces重写+路由参数=不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!