从AngularJS URL删除片段标识符（＃符号）
是否有可能从angular.jsurl中删除＃符号？
我仍然希望能够使用浏览器的后退button等，当我改变视图，并将用PARAMS更新url，但我不想＃符号。
教程routeProvider声明如下：
angular.module('phonecat', []). config(['$routeProvider', function($routeProvider) { $routeProvider. when('/phones', {templateUrl: 'partials/phone-list.html', controller: PhoneListCtrl}). when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}). otherwise({redirectTo: '/phones'}); }]); 我可以编辑这个具有相同的function没有＃？
是的，你应该configuration$locationProvider并将html5Mode设置为true ：
angular.module('phonecat', []). config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { $routeProvider. when('/phones', {templateUrl: 'partials/phone-list.html', controller: PhoneListCtrl}). when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}). otherwise({redirectTo: '/phones'}); $locationProvider.html5Mode(true); }]);
请务必检查浏览器对html5历史API的支持：
if(window.history && window.history.pushState){ $locationProvider.html5Mode(true); }
要删除一个漂亮的URL的哈希标记，也为了让你的代码在缩小后工作，你需要像下面的例子那样构build你的代码：
jobApp.config(['$routeProvider','$locationProvider', function($routeProvider, $locationProvider) { $routeProvider. when('/', { templateUrl: 'views/job-list.html', controller: 'JobListController' }). when('/menus', { templateUrl: 'views/job-list.html', controller: 'JobListController' }). when('/menus/:id', { templateUrl: 'views/job-detail.html', controller: 'JobDetailController' }); //you can include a fallback by including .otherwise({ //redirectTo: '/jobs' //}); //check browser support if(window.history && window.history.pushState){ //$locationProvider.html5Mode(true); will cause an error $location in HTML5 mode requires a tag to be present! Unless you set baseUrl tag after head tag like so: <head> <base href="/"> // to know more about setting base URL visit: https://docs.angularjs.org/error/$location/nobase // if you don't wish to set base URL then use this $locationProvider.html5Mode({ enabled: true, requireBase: false }); } }]);
在$locationProvider.html5Mode(true)在app.js设置后，我在web.config中写出一条规则。
希望帮助别人。
<system.webServer> <rewrite> <rules> <rule name="AngularJS" stopProcessing="true"> <match url=".*" /> <conditions logicalGrouping="MatchAll"> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" /> </conditions> <action type="Rewrite" url="/" /> </rule> </rules> </rewrite> </system.webServer>
在我的index.html中，我将它添加到<head>
<base href="/">
不要忘记在服务器上安装iis的url重写器。
另外，如果您使用Web Api和IIS，则此匹配url将无法工作，因为它会更改您的API调用。 因此，添加第三个input（条件的第三行），并给出一个排除www.yourdomain.com/api调用的模式
如果你使用MVC与AngularJS进行.NET堆栈，那么你需要做的就是从url中删除'＃'：
-
在你的_Layout页面设置你的基础href：
<head> <base href="/"> </head> -
然后，在你的angular度应用程序configuration中添加以下内容：
$locationProvider.html5Mode(true) -
上面会从url中删除'＃'，但是页面刷新不起作用，比如如果你在“yoursite.com/about”页面，refreash会给你一个404。这是因为MVC不知道angular度路由，通过MVC模式将寻找一个“about”的MVC页面，该页面在MVC路由path中不存在。 解决这个问题的方法是将所有MVC页面请求发送到单个MVC视图，您可以通过添加捕获所有
url：
routes.MapRoute( name: "App", url: "{*url}", defaults: new { controller = "Home", action = "Index" } );
你可以调整html5mode，但是这只适用于你的页面的html锚点中包含的链接，以及在浏览器地址栏中url的样子。 试图从页面外的任何地方请求没有hashtag（有或没有html5mode）的子页面将导致404错误。 例如，下面的CURL请求将导致页面未find错误，而不考虑html5mode：
$ curl http://foo.bar/phones
虽然以下将返回根/主页：
$ curl http://foo.bar/#/phones
原因是在请求到达服务器之前，哈希标签之后的任何内容都被剥离掉了。 所以http://foo.bar/#/portfolio的请求作为http://foo.bar/#/portfolio的请求到达服务器。 服务器将回应一个200 OK响应（推测）为http://foo.bar和代理/客户端将处理其余的。
所以，如果你想与他人分享一个url，你别无select，只能包含hashtag。
按照2个步骤 –
1.首先在您的应用程序configuration文件中设置$ locationProvider.html5Mode（true） 。
对于例如 –
angular.module('test', ['ui.router']) .config(function($stateProvider, $urlRouterProvider, $locationProvider) { $locationProvider.html5Mode(true); $urlRouterProvider.otherwise('/'); });
2.在主页面内设置<base> 。
例如 – >
<base href="/">
$ location服务将自动回退到不支持HTML5 History API的浏览器的散列部分方法。
我的解决scheme是创build.htaccess和使用#Sorian代码..没有.htaccess我未能删除＃
RewriteEngine On RewriteBase / RewriteCond %{REQUEST_URI} !^(/index\.php|/img|/js|/css|/robots\.txt|/favicon\.ico) RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ./index.html [L]
正如在上面的答复中提到的那样，
添加到index.html在app.js中启用html5mode $ location.html5Mode（true）。
有了这个应用程序将工作良好。 但是只有在您从index.html导航到其他页面的场景中。 例如我的基本页面是www.javainuse.com。 如果我点击链接Java它将正确导航到www.javainuse.com/java。
但是，如果我直接去www.javainuse.com/java将得到页面没有发现错误。
要解决这个问题，我们必须使用url重写。 Dot net需要IIS的URL重写。
如果你正在使用tomcat，那么URL重写将不得不使用Tuckey完成。 这里可以得到更多关于URL重写的信息
根据文件。 您可以使用：
$locationProvider.html5Mode(true).hashPrefix('!');
注意：如果你的浏览器不支持HTML 5.不要担心：D它有后备hashbang模式。 所以，你不需要手动检查
if(window.history && window.history.pushState){ ... }
例如：如果您点击： <a href="/other">Some URL</a>
在HTML5浏览器中 ：angular会自动redirect到example.com/other
在不是HTML5浏览器中 ：angular会自动redirect到example.com/#!/other
第1步：注入$ locationProvider服务到应用程序configuration的构造函数
第2步：添加代码行$ locationProvider.html5Mode（true）到应用程序configuration的构造函数。
步骤3：在容器（登陆，主或布局）页面中，在标签内添加html标签，如<base href="/"> 。
第4步：从所有锚点标签中删除所有用于路由configuration的“＃”。例如，href =“＃home”变为href =“home”; href =“＃about”变为herf =“about”; href =“＃contact “变成href =”联系人“
<ul class="nav navbar-nav"> <li><a href="home">Home</a></li> <li><a href="about">About us</a></li> <li><a href="contact">Contact us</a></li> </ul>
这个答案假设您使用nginx作为反向代理，并且您已经将$ locationProvider.html5mode设置为true。
– 对于那些可能还在苦苦挣扎的人来说。
当然，@ maxim grach解决scheme可以正常工作，但是对于如何响应不希望hashtag被包含在第一个地方的请求的解决scheme，可以检查php是否发送404，然后重写url。 以下是nginx的代码，
在PHP的位置，检测404错误的PHP和redirect到另一个位置，
location ~ \.php${ ... fastcgi_intercept_errors on; error_page 404 = /redirect/$request_uri ; }
然后重写URLredirect位置和proxy_pass数据，offscourse，把你的网站的url在我的博客的url。 （请求：只有在你尝试之后才提问）
location /redirect { rewrite ^/redirect/(.*) /$1; proxy_pass http://www.techromance.com; }
并看到魔法。
它绝对有效，至less对我来说。
只需添加$locationProvider In
.config(function ($routeProvider,$locationProvider)
然后添加$locationProvider.hashPrefix(''); 后
.otherwise({ redirectTo: '/' });
而已。
