Pass invisible or hidden parameters using routerLink Angular

You can use History state to pass dynamic data to the component you want to navigate to, without adding them into the URL, like so :

this.router.navigateByUrl('/user', { state: { orderId: 1234 } });

or

<a [routerLink]="/user" [state]="{ orderId: 1234 }">Go to user's detail</a>

and you can get it this way

constructor() {
  this.router.events
   .pipe(filter(e => e instanceof NavigationStart))
   .subscribe((e: NavigationStart) => {
    const navigation  = this.router.getCurrentNavigation();
    this.orderId = navigation.extras.state ? navigation.extras.state.orderId : 0;
   });
 }