如何处理我的 URL 中的 AngularJS 格式正斜杠以转义代码 %2F答案

【问题标题】：How to deal with AngularJS formatting forward slash in my URL to escape code %2F如何处理我的 URL 中的 AngularJS 格式正斜杠以转义代码 %2F
【发布时间】：2016-12-07 03:56:26
【问题描述】：

我正在尝试使用 AngularJS 1.6.0-rc.2 实现单页应用程序，并且它一直在将正斜杠格式化为其转义代码 %2F我的网址。因此，它不会被路由检测到。

我已经阅读了 hashbangs 并尝试通过设置 HTML5 模式来修复它，但 url 不断被转换。

问题

1 - 为什么 Angular 必须做这样的事情，进行这种转换的目的是什么？

2 - 我注意到 1.3 版没有这样做。我应该改用这个版本吗？

3 - 如何解决？

更多详情

我有 3 个页面和 1 个 javascript 文件

index.htm
home.htm
forecast.htm
app.js

以下是我认为可能相关的 app.js 部分：

$routeProvider
    .when('/', {
        templateUrl: 'pages/home.htm',
        controller: 'homeController'

    })
    .when('/forecast', {
        templateUrl: 'pages/forecast.htm',
        controller: 'forecastController'

    })

我的 index.htm 有我的 ng-view

以及home.htm的一部分：

 <a href="#/forecast" class="btn btn-primary">Get Forecast</a>

所以当点击链接 'Get Forecast' 时，我得到的 URL 是这样的：

http://127.0.0.1:65381/index.htm#!/#%2Fforecast

这意味着，该 URL 与路由不匹配，那么我仍然有我的 home.htm 内容而不是 forecast.htm

【问题讨论】：

尝试删除#，否则在启用html5Mode时向您的routeProvider添加*
stackoverflow.com/questions/16837704/…这个问题应该对你有帮助
@SterlingArcher，删除 # 我得到了这个 URL：http://127.0.0.1:65381/forecast。如果我只启用 HTML5，我的 home.htm 内容将不会显示。我尝试在我的链接中添加属性 target=self 但没有任何改变。阅读我也尝试过的 $location 文档：html5Mode({ enabled: false, requireBase: false, rewriteLinks: false }); 但它仍然将转义码添加到 url

标签： javascript angularjs url escaping

【解决方案1】：

我从朋友那里得到了一些帮助，解决方案是在我的链接上添加 '!'，所以不要：

<a href="#/forecast" class="btn btn-primary">Get Forecast</a>

应该是这样的：

<a href="#!/forecast" class="btn btn-primary">Get Forecast</a>

我知道这是 hashbang 模式，它已被弃用，我只是想知道如何使用 Angular 正确使用它。

参考： What's the shebang/hashbang (#!) in Facebook and new Twitter URLs for?

所以我现在就更新我的链接...

【讨论】：