Ember.js 2. Nested routes but non-nested templates

Question

First of all, thank you all for your efforts in this forum.

I have this situation:

• mysite.com/authors (list of authors)
• mysite.com/author/1 (author 1)
• mysite.com/book/1 (book 1 of author 1)
• mysite.com/cart/1 (cart page of book 1 of author 1)

I need an url like this:

mysite.com/author/1/1/cart

but I don't want nested template (every page is different and I don't want same info in many page).

Is there a way to have that URL?

My actual router.js is this:

Router.map(function() {
  this.route('index', {path: '/'});
  this.route('login');
  this.route('authors', {path: '/authors'});
  this.route('author', {path: '/author/:author_id'});
  this.route('book', {path: '/book/:book_id'});
  this.route('cart', {path: '/cart/:cart_id'});
});

Answer 1

You have two options:

Multiple dynamic segments

Just don't nest your routes but have multiple dynamic segments. Thats possible:

this.route('cart', {path: '/cart/:author_id/:cart_id'});

This will give you a route like this:

/cart/1/A this will render the cart route with the author 1 and the cart A

Nest but just don't put anything into the parent route

So you can have this router:

this.route('author', {path: '/author/:author_id'}, function() {
  this.route('cart', {path: '/cart/:cart_id'});
});

Now your problem is that if you put the author data into the /author route its also visible on the author.cart route. But a simple solution is to keep the author route empty, with just {{outlet}} as the template and put your author stuff into the author.index route.

This will give you routes like this:

/author/1 this will render the author.index route with the author 1

/author/1/cart/A this will render the author.cart route with the author 1 and the cart A