Show different routes to user than actual in angular

Question

I am working on a full stack web development using Angular, Node(Express) and mySQL. I want to show user some different route than what it actually is. How can I do that? For example, this is my dashboard page.

http://localhost:4200/#/dashboard

I want it to be viewed as something else to the user like:

http://localhost:4200/#/Welcome 
OR
http://localhost:4200/#/Welcome/LandingPage

Meaning, this page can only be accessed if you enter the Url:

 http://localhost:4200/#/dashboard

and, if the user tries to access this page by entering the Url that is being shown to him:

http://localhost:4200/#/Welcome 
OR
http://localhost:4200/#/Welcome/LandingPage

then, he gets an error.

I have done this all in app.routing.ts. I just want to ask how can I do the above mentioned. To show that route to the user that actually doesn't exist.

For further clarification: When the user will open the page then it will be shown to him as "localhost:4200/#/Welcome". I want to just show the user this route. In my code, it actually should remain dashboard. In easy words, when the user enters the url: "localhost:4200/#/Welcome" it should throw an error because in code such route doesn't exist. It was just shown to the user as a kind of fake route. In actual, it should be "localhost:4200/#/dashboard" but, shows to user as "localhost:4200/#/Welcome"

Answer 1

I guess maybe using location will do the trick if I understood question right.

constructor(private location: Location){}
replaceState(){ 
  this.location.replaceState("/Welcome");
}

You will have to import Location module:

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