In ember, how can I correctly treat routes whose pathnames contain hashes (#) as fragment identifiers?

Question

In my router I have the following block:

Router.map(function() {
  this.route('stuff');
  this.route('registration', { path: '/registration' });
  this.route('registration-first', { path: '/registration#first' });
});

The reason I wish to do this is so that from a user perspective, it makes logical sense that each route is a subsection or "fragment" of a single pipeline, but internally, I'm treating each page as a separate route because separation of concerns make more sense for my use case.

The approach above works perfectly fine except when I perform the following:

• Transition to the hashed route
• Return to the previous route/page (back button, browser)
• Forward back to the hashed route/page

At this point in time the browser successfully adds the fragment identifier to the URL, but my route does not transition to the hashed route. Is there any way I can achieve this? Thanks.

Answer 1

You dont. At least not with the # sign. The problem is that # already has a special meaning in a URL: Its the seperator between the path and the hash. Its historically used for anchors on a page. Ember used the hash to store the entire URL before the history API was avaliable.

Honestly I would go with /registration/first and /registration/second, but I think there are other seperators you could use. However you should know that some chars are escaped depending on your browser.