以角度隐藏浏览器url中的查询参数答案

【问题标题】：hiding query parameters in the browser url in angular以角度隐藏浏览器url中的查询参数
【发布时间】：2020-10-28 15:23:50
【问题描述】：

我想在成功登录后重定向到另一个 url。此外，当它重定向时，我还想隐藏查询参数。这是我的 LoggedinGuard

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        if (this.authService.getUser()) {
          return true;
        } 
        this.router.navigate(['login'], { queryParams: { redirectUrl: state.url }});
        return false;
    }

登录成功后浏览器中的链接为http://localhost:4200/login?redirectUrl=%2Fgetup

但我需要显示为 http://localhost:4200/login

我该怎么做？

【问题讨论】：

标签： angular typescript

【解决方案1】：

您可以使用state 而不是查询参数来传递您的值。（就像您似乎已经在显示代码中的 url 变量一样）

this.router.navigate(['login'], { state: { redirectUrl: state.url }});

【讨论】：

感谢您的评论。但它无法显示此错误类型的参数 '{ state: { redirectUrl: string; }; }' 不可分配给“NavigationExtras”类型的参数。对象字面量只能指定已知属性，并且“状态”不存在于“NavigationExtras”类型中。
你使用的是什么版本的角度？
angular 10. 还有其他可用的解决方案吗？

【解决方案2】：

在重定向到的组件中。把这段代码sn-p。

import { Location } from "@angular/common"; 

constructor(private location: Location) {}

ngOInit() {
 this.cleanURL();
}

cleanURL() {
// Use this method where its needed.
  this.location.replaceState('login');
}

【讨论】：

感谢您的回答。这是第一次尝试。但是当我重新加载登录页面时，它不会被重定向到“getup”