AngularJS：如何清除URL中的查询参数？

我的AngularJS应用程序需要有权访问用户的LinkedIn个人资料。为此，我需要将用户重定向到一个LinkedIn URL，该URL包含一个回调redirect_uri参数，该参数将告诉LinkedIn将用户重定向回我的Web应用程序，并在URL中包含一个“代码”查询参数。这是传统的Oauth 2.0流程。

一切工作正常，除了LinkedIn将用户重定向回以下URL：

http://localhost:8080/?code=XXX&state=YYY#/users/123/providers/LinkedIn/social-sites

我想?code=XXX&state=YYY从URL中删除以便使其干净。用户不需要查看我从LinkedIn重定向接收到的查询参数。

我试过了$location.absUrl($location.path() + $location.hash()).replace()，但是它使查询参数保留在URL中。

我也无法使用提取查询参数，例如“ code” ($location.search()).code。好像有？在上述网址中的＃之前欺骗Angular。

我用

$location.search('key', null)

因为这不仅删除了我的密钥，而且从URL的可见性中将其删除了。

我最终从AngularJS论坛得到了答案。看到这个线程的详细信息

链接指向一个Google网上论坛线程，该线程很难阅读且没有提供明确的答案。要删除URL参数，请使用

$location.url($location.path());

要删除所有查询参数，请执行以下操作：

$location.search({});

要删除一个特定的查询参数，请执行以下操作：

$location.search('myQueryParam', null);

要清除项目，请删除它并调用$$ compose

    if ($location.$$search.yourKey) {
        delete $location.$$search.yourKey;
        $location.$$compose();
    }

衍生自angularjs来源：https : //github.com/angular/angular.js/blob/c77b2bcca36cf199478b8fb651972a1f650f646b/src/ng/location.js#L419-L443

您可以使用以下方法删除特定的查询参数：

delete $location.$$search.nameOfParameter;

或者，您可以通过将search设置为一个空对象来清除所有查询参数：

$location.$$search = {};

在撰写本文时，正如@Bosh先前所提到的，html5mode必须true能够设置$location.search()它并将其反映回窗口的可视URL。

有关更多信息，请参见https://github.com/angular/angular.js/issues/1521。

但是如果 html5mode 是，true您可以使用以下命令轻松清除URL的查询字符串：

$location.search('');

要么

$location.search({});

这还将更改窗口的可视URL。

（已在AngularJS版本中1.3.0-rc.1进行了测试html5Mode(true)。）

需要使它在html5mode= 时起作用false吗？

所有其他的答案只有工作的时候角的html5mode是true。如果您在之外工作html5mode，则$location仅指代哈希中存在的“伪造”位置-因此$location.search无法查看/编辑/修复实际页面的搜索参数。

这是一种解决方法，可以在角度加载之前插入页面的HTML中：

<script>
  if (window.location.search.match("code=")){
    var newHash = "/after-auth" + window.location.search;
    if (window.history.replaceState){
      window.history.replaceState( {}, "", window.location.toString().replace(window.location.search, ""));
    }
    window.location.hash = newHash;
  }
</script>

只需使用

$location.url();

代替

$location.path();

如果要移至另一个URL并清除查询参数，请使用：

$location.path('/my/path').search({});

如果使用路由参数，只需清除$ routeParams

$routeParams= null;

将位置哈希值设置为null怎么样

$location.hash(null);

如果您立即处理参数然后移至下一页，则可以在新位置的末尾添加问号。

例如，如果您要完成$ location.path（'/ nextPage'）;

您可以改为：$ location.path（'/ nextPage？'）;

我已经尝试了以上答案，但无法使其正常工作。唯一对我有用的代码是$window.location.search = ''

我可以用以下一行替换所有查询参数：$location.search({});
易于理解和轻松清除它们的方法。

可接受的答案对我有用，但是我需要更深入一点以解决“后退”按钮的问题。

我注意到的是，如果我使用链接到页面<a ui-sref="page({x: 1})">，然后使用删除查询字符串，则$location.search('x', null)在浏览器历史记录中没有多余的输入，因此后退按钮会将我带回到开始的地方。尽管我觉得这是错误的，因为我认为Angular不会自动为我删除此历史记录条目，但这实际上是我的特定用例所希望的行为。

问题是，如果我使用链接的页面<a href="https://stackoverflow.com/page/?x=1">，而不是，然后取出查询字符串以同样的方式，我做得到我的浏览器历史上的一个额外名额，所以我必须单击后退按钮两次，回到我开始。这是不一致的行为，但实际上这似乎更正确。

我可以使用轻松解决href链接问题$location.search('x', null).replace()，但是当您通过ui-sref链接进入页面时，这会破坏页面，所以这不好。

经过很多摆弄之后，这是我想出的解决方法：

在我的应用程序的run功能中，我添加了以下内容：

$rootScope.$on('$locationChangeSuccess', function () {
    $rootScope.locationPath = $location.path();
});

然后，我使用以下代码删除查询字符串参数：

$location.search('x', null);

if ($location.path() === $rootScope.locationPath) {
    $location.replace();
}

对于Angular> 2，可以将null传递给所有要清除的参数

this.router.navigate(['/yourRoute'], {queryParams:{params1: null, param2: null}})