Solvedangular Angular 2 Router to hide browser url parameter Id's and give alias names

I am trying to route from EmployeeLIst to employeeDetail after I click on employee with ID 23. How do I route to employeeDetail/23 but on browser URL show the user an alias like /EmployeeDetails?

Background

I'm trying to implement Angular 2 routing and when I went to the detail section I see:

http://localhost:3444/employeedetail/23.

Here I want to hide that 23 on the browser URL, why do i want to show the ID which can be sensitive. In UI-Router we used to have URL="something" and that URL is visible on the browser URL. Don't we have similar in Angular2 like passing RouteParams and have custom name on the browser URL instead of the Route name itself.

Example

http://plnkr.co/edit/QgehylornOgXhTaZX8Yn?p=preview

{path: 'crisis-center/:id/:id2', component: CrisisDetailComponent}

I want to hide those IDs on the browser URL and instead present an alias route name.

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

Worked for me to have matrix params hidden from the URL, only the required links need to have the flag set and others work as normal urls.

Yes, you are right. Then only skipLocationChange property could be used to protect a user from seeing URL change.

@OdaiTu @marslan2037
Making it like that you hides all parameters and then you manually set the url to your desired state.

this.router.navigate(['dashboard/company/'], { queryParams: { id: res }, skipLocationChange: true });
window.history.pushState('','',user.email)

You still can get the queryParams on your other component even with skipLocationChange: true

ngOnInit() {
let param = this.router.parseUrl(this.router.url);
console.log(param.queryParams.id)
}

what if i want to replace the id by the name ??
but i still send the id to the server to get the data