Ember router can transition to but not handle a url

Question

Using Ember 2.1.0 with EmberData, I'm making a small blogging app. It has two routes

Router.map(function(){
  this.route("posts", {path: "/"});
  this.route("post", {path: '/:seo_friendly_link'});
}

The seo_friendly_link looks like this

 /2015/10/28/my-blog-post-title/

In the index route, I display a list of posts with links to each post. If I click a link, the Ember app will transition to the post that I clicked on showing the seo-friendly-url in the browser. I emphasize transitionto-- the routing goes through that method in Ember router. Everything works fine up to here.

The problem:

However, if I drop/type that same url into the browser (rather than transition to it from a link on the homepage), I get an UnrecognizedURLError (before the model or even the beforeModel hook are called for the post). If I drop the url into the browser, the routing goes through the handleURL method on Ember Router, which doesn't happen if I click a link from the homepage. So my Ember app can transition to my seo_friendly_link, but not handle that url.

I'm not sure why.

Question: How can I create a route to recognize that link?

Code

There is a property on the Post model called

   seo_friendly_link: DS.attr('string')

In /routes/post, I call the serialize method to create that parameter from the model property

  serialize: function(model, params){
     seo_friendly_link: model.get("seo_friendly_link");
  }

It looks like you have a syntax error in the second line of your router definition (this.route("posts": "/");). Do you mean this.route("posts", {path: "/"});? — Gabriel Grant
@GabrielGrant thank you. That was just a typo. I had it correct in my application (i.e. it's not the cause of the problem underlying this question) — Leahcim
Yes, didn't sound like that was the problem, just wanted to make sure I properly understood what you were asking. — Gabriel Grant
(also, not that it really matters, but you still have a : instead of a , in that line) — Gabriel Grant
fixed that too. thanks I also added clarifying detail in a few sentences to make sure the problem was understood. i.e. I can transition to the seo-friendly-route url and show the post by clicking a link, but I get an UnrecognizedURLError if I type the url in a browser. — Leahcim

dwickern dwickern · Accepted Answer · 2015-10-30T01:17:11

Your dynamic segment /:seo_friendly_link doesn't match slashes, e.g. it will match /2015 but not /2015/10.

To match the whole path including slashes, change the : to an *:

Router.map(function(){
  this.route("posts", {path: "/"});
  this.route("post", {path: '/*seo_friendly_link'});
}

Ember router can transition to but not handle a url

1 Answers