我已经完成了$locationProvider.html5Mode(true);
但它不起作用。每当我访问http://example.com
它都会转到http://example.com/#!/
.代码在这里给出:
var myApp = angular.module('myApp', ['ui.router', 'ui.bootstrap']);
myApp.config(['$qProvider', function ($qProvider) {
$qProvider.errorOnUnhandledRejections(false);
}]);
myApp.config(function($stateProvider, $urlRouterProvider,$locationProvider) {
// For any unmatched url, redirect to EXTRANET home page
$urlRouterProvider.otherwise('/');
// Now set up the states
$stateProvider
.state('listrole', {
url: "/list-role",
views: {
'main-content': {
templateUrl: rootUrl+ 'views/main.html',
controller: 'rolesCtrl'
}
}
})
$locationProvider.hashPrefix('');
$locationProvider.html5Mode(true);
});
更新我也添加了$locationProvider.hashPrefix('');
但没有区别。另外让我告诉你,我在地址栏中输入地址并按回车键。我做的对吗?浏览器如何发现它不需要从服务器刷新?
更新 #2
理想情况下,我希望URL为http://example.com
,http://example.com/#!/list-role
http://example.com/list-role
。现在http://example.com/list-role
给 404
更新 #3
我正在使用nginx代理,如果有帮助的话。
更新 #4
已擦除缓存。现在我可以看到http://example.com
而不是http://example.com/#!
但仍然http://example.com/list-role
给出 404
删除此前缀,请将以下代码添加到配置中:
appModule.config(['$locationProvider', function($locationProvider) {
$locationProvider.hashPrefix('');
}]);
来源 这里 了解更多信息。
更新
如果要删除整个前缀(#
而不仅仅是!
),则可以尝试以下解决方案:
1) 激活 HTML5 模式并删除模块配置中的前缀!
$locationProvider.html5Mode(true);
$locationProvider.hashPrefix('');
2)然后在索引的<head>
中将base设置为/
.html
<head>
...
<base href="/">
</head>
添加到您的 html 文件中<head> <base href="/foldername/"> </head>
这个是针对你的应用的.js $locationProvider.html5Mode(true);
如果您没有,则用于创建文件.htaccess
。
RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
RewriteRule ^ /foldername/
下面的代码将删除URL中的感叹号(!)
$locationProvider.hashPrefix('');
或者转到使用 yeoman 设置的 AngularJS 项目的路由问题
它对我有用
将以下内容添加到应用程序.js
app.config(['$locationProvider', function($locationProvider) {
$locationProvider.hashPrefix('');
}]);
如果你在带有 MVC 和 AngularJS 的 .NET 堆栈中,这就是你必须做的从 url 中删除"#":
1.在_Layout页面中设置基本 href:
<head> <base href="/"> </head>
2.然后,在您的角度应用程序配置中添加以下内容:
$locationProvider.html5Mode(true)
$locationProvider.hashPrefix("!");
$locationProvider.hashPrefix('');
请检查这个问题:AngularJS ui-router 应用程序在 URL 中有/#!/