3

Consider I want to rewrite a URL from /register to /tenant/register, where:-

  • /register does not have an actual view, as it only serve to make URL nicer.
  • /tenant/register is the actual view, with a <my-tenant-register> view element.

Is it possible to rewrite URL using <app-route>? So that it can sort of have a virtual path and redirect to app-route accordingly with certain rules.

Andrew See
  • 1,062
  • 10
  • 21

2 Answers2

1

Taking PSK as an example, we need to add a path-changed listener in <app-location> as follow:-

<app-location id="location"
    route="{{route}}"
    url-space-regex="^[[rootPath]]"
    on-path-changed="rewritePath">
</app-location>

Then define the rules for the rewritePath() as follow:-

/**
 * Rewrite path before passing to <app-route>
 */
rewritePath() {
  let location = this.$.location;

  let path = location.path;
  if (path == '/register') {
    location.path = '/tenant/register';
  }
}
Andrew See
  • 1,062
  • 10
  • 21
0

Regarding the head of your question, add : 

<app-location route="{{newRoute}}"></app-location>

top of your custom element and define a new route dynamically at your function as: 

this.set('newRoute.path', "/tenant/register");// That you really want to go.

this.set method will direct your new target something like you have pressed <a href='/tenant/register'>Tenant/Register </a>

Cappittall
  • 3,300
  • 3
  • 15
  • 23
  • 1
    That's not what I am looking for as I already know how to change the route by setting `route.path`. I intend to rewrite the path before it get process by ``. Your answer does give me a hint on the answer I am looking for, which I am going to share it. Thanks! – Andrew See Mar 07 '18 at 22:02
  • Actually, I thought the same; I saw, this answer is not exactly what you look for when I read one more your question, but I kept it instead of delete that may give another idea.:) – Cappittall Mar 08 '18 at 06:20