自从我开始处理这个问题已经好几个小时了，我似乎无法摆脱这个问题。
我有一个可能导致用户实际输入网址的应用程序。在这种情况下，不难相信用户可能会输入尾部斜线。例如，
www.example.com/users/2 and www.example.com/edit/company/123
应该是一样的
www.example.com/users/2/ and www.example.com/edit/company/123/
这只需要在客户端处理URL路由。我没有兴趣在资源/ API调用中处理尾部斜杠。我只想在浏览器中处理拖尾的兴趣。
所以我研究并发现网上没有多少答案。他们中的大多数引导我到角ui路由器的FAQ部分。
https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions
在这里，他们告诉我们写一个规则，这是我想要做的，但它似乎没有工作，或者也许我做错了。
这是我添加了我的代码的plunkr。
http://plnkr.co/edit/fD9q7L?p=preview
我把它添加到我的配置，其余的代码是基本的东西。
$urlRouterProvider.rule(function($injector,$location) {
//if last charcter is a slash,return the same url without the slash
if($location.$$url[length-1] === '/') {
return $location.$$url.substr(0,$location.$$url.length - 2);
} else {
//if the last char is not a trailing slash,do nothing
return $location.$$url;
}
});
基本上，我想使可选的尾部斜线，即地址栏的存在或不存在对加载的状态没有影响。
有一个工作
plunker的链接
这是更新的规则定义：
$urlRouterProvider.rule(function($injector,$location) {
var path = $location.path();
var hasTrailingSlash = path[path.length-1] === '/';
if(hasTrailingSlash) {
//if last charcter is a slash,return the same url without the slash
var newPath = path.substr(0,path.length - 1);
return newPath;
}
});
这些链接现在可以正常工作：
<ul class="nav">
<li><a ui-sref="route1">Route 1</a></li>
<li><a ui-sref="route2">Route 2</a></li>
<li><a href="#/route1/">#/route1/</a></li>
<li><a href="#/route2/">#/route2/</a></li>
<li><a href="#/route1" >#/route1</a></li>
<li><a href="#/route2" >#/route2</a></li>
</ul>
魔术可以这样定义：如果有变化，请返回更改值…否则不做任何事情… see example