angular - 在我的网址中解析查询参数后隐藏查询参数

Question

我的前端在http://host:4200中，当另一个前端想要打开它时，例如使用 window.open( http://host:4200?username=a&department=b ) 所以这个http://host:4200 ?username=a&department=b将在地址栏中，如何从该 url 中删除查询参数？

如果我使用这两行代码来隐藏查询参数它可以工作但有延迟，因为我在读取 url 后删除了第二个查询参数是可见的：

const url1 = window.location.toString();
const sanitizedUrl = url1.substring(0, url1.indexOf('?'));
window.history.replaceState({}, document.title, sanitizedUrl);

这是我的 cpp.component.ts 代码，我需要读取其中的查询参数，它的角度为 5，

 @Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

  username = '';
  department = '';  

  constructor(
    private feedbackService: ApiService,
    private titleService: Title,
     private route: ActivatedRoute) {
  }

  ngOnInit() {

    this.route.queryParams.subscribe(params => {
      if (params.hasOwnProperty('username')) {
        this.username = params['username'];
      }

      if (params.hasOwnProperty('department')) {
        this.department = params['department'];
      }

    });
  }

Answer 1

您可以使用该skipurlchange属性router.navigate

constructor(private router:Router){}

this.router.navigate(['/yourview'], { queryParams:  youParam ,skipLocationChange: true });