如何在 url javascript 中传递“问号”答案

【问题标题】：how to pass "question mark" in url javascript如何在 url javascript 中传递“问号”
【发布时间】：2013-03-04 09:01:38
【问题描述】：

在 Angularjs 应用程序中，我有一个类似
http://url.com/my_app/#/store/items 的网址。
现在我想附加查询字符串，例如，
http://url.com/my_app/#/store/items?page=2。

但在 url 中，javascript 对我不想要的 "?" to "%3F" 进行编码。它应该保留“？”仅在 url 中，因为 angularjs $location.search() 不为“%3F”返回任何内容。

怎么做？

【问题讨论】：

查看w3schools.com/jsref/jsref_encodeuri.asp
URL 模式应该看起来像 http://url.com/my_app/#/store/items/page/2 而不是 http://url.com/my_app/#/store/items?page=2。因为在# 之后使用/ 模式而不是? 模式可能更正确
不，我只想在 qurystring 中添加它。它的要求//
为什么不使用$location.search('page',2) 来设置查询？还是使用 routeparams？
谢谢.. 没错！！

标签： javascript angularjs

【解决方案1】：

您的问题中没有足够的细节，所以我假设您在非 HTML5 模式下使用 AngularJS 路由 - 或者至少是 $location service。如果是这样，# 字符之后的部分从单页应用程序的角度表示您的 URL（更多关于 AngularJS here）。

如果上述假设正确，则意味着您不应尝试“手动”添加或操作问号。相反，您应该更改$location 的search 部分以操作查询字符串（? 之后的部分），并且问号将根据需要添加/删除到最终 URL。

在你的情况下，你可以写：

$location.path('/store/items').search('page', 2)

这是假设您正在从 JavaScript 操作 URL，如您的问题中所述。

【讨论】：

非常好的答案！对我来说效果很好，而且比我做的更干净，因为我没有 RTFM：D
绝对是正确的答案。如果你在应用程序的其他地方有一个预建的 URL，你现在必须解析成 3 个值，这有点糟糕。呃……那是有角的便便。哎哟！
@Mark 如果您不想拆分网址，请参阅我的回答。
非常简洁的答案！虽然很简单，但想提一下，您也可以使用对象语法传递多个搜索参数。但是，在这种情况下，角度将用提供的对象替换完整的搜索对象。

【解决方案2】：

如果您使用 $location 服务，请改用$location.url('/store/items?page=2')。这至少是 1.0.7 的 setter 方法，在我的 1.1.5 应用程序中很有效。

【讨论】：

如果您只有 url 字符串，则定义最佳答案。

【解决方案3】：

您可以创建一个参数对象，如：

var param = {
    page: 2
}
$location.url("/store/items").search(param)

【讨论】：

【解决方案4】：

如果您使用强烈推荐的 ui-router，您可以使用$state.go(to, params, options)，如here 所述。

作为先决条件，您需要正确定义您的状态，这意味着必须让 ui-router 知道每个可能的查询参数。请参阅以下示例（page 和 otherParam）：

$stateProvider.
state('storeItems', {
  url: '/store/items?page&otherParam',
  templateUrl: '/modules/store/views/item.client.view.html'
});

然后你可以通过调用来切换位置，例如从控制器中切换

$scope.gotoItemsPage = function(page) {
  $state.go('storeItems', {
    page: page,
    otherParam: 'Just a show off'
  });
};

无需摆弄所需的编码和高度可读性！

【讨论】：

【解决方案5】：

您可以使用decodeURIComponent。

例如：

decodeURIComponent('http://url.com/my_app/#/store/items%3Fpage=2');
// will give you `http://url.com/my_app/#/store/items?page=2`

【讨论】：

不要为自己摆弄网址！在角度上下文中，有比这更好的方法。查看@pkozlowski.opensource 的答案，甚至更好地使用 $state.go(to, params, options) 其中 params 是一个对象，其中包含在您的状态中定义的查询参数及其未编码的值。