mardi 18 août 2015

Conditionally showing a parameterized route's output for the root route of an Ember.js app?

I'm customizing an existing Ember.js 1.11 app. (I can modify its code, but I'd like to keep any changes to a minimum, if possible.)

It has a route like /item/:itemName/:itemId for displaying info about a specific item.

In some cases, I'd like to have the root route (i.e. /) display info about a specific item instead of the root route's default content.

That is:

  • Browsing to hxxps://example.com/ would show the default content in some cases.
  • In other cases, going to hxxps://example.com/ would show the same content as hxxps://example.com/item/item-name/12345, but the browser should still show the URL as just hxxps://example.com/.
  • The item page would still be accessible at hxxps://example.com/item/item-name/12345 like usual, too.

I can somewhat achieve this by having the root route conditionally use replaceWith('/item/item-name/12345') to transition to the item route when loading, but that causes the URL shown in the browser to change (which I don't want to have happen in this case).

I could not find a way to perform a transition while still leaving the URL unchanged.

I also considered defining the route mapping differently in each case, along the lines of:

...
this.route('item', { path: '/item/:itemName/:itemId' });

if(is_showing_default_root_route_content) {
    this.route('root', { path: '/' });
}
else {
    this.route('/item/item-name/12345', { path: '/' });
}
...

But that doesn't seem to work, and maybe it doesn't even make sense to do.

Is there a clean way to:

  1. Transition to another route without changing the URL shown by the browser? or,
  2. Have the root route output the content of a separate parameterized route?



Aucun commentaire:

Enregistrer un commentaire