ember.js - Using Handlebars link-to for nested routes -

in ember-based project have book object consists array of chapters, each of array of sections.

i have nested route looks this:

  this.resource('book', { path: 'book/:id' }, function() {         this.resource('section', { path: 'chapter/:chapter_num/section/:section_num'});   }); 

in handlebars template have looks menu:

   <ul>         <li>{{#link-to 'book' this}}home{{/link-to}}</li>         {{#each chapter in chapters}}             <li>{{title}}</li>             <ul>                 {{#each section in sections}}                     <#link-to ???what put here???>{{section}}</link-to>                 {{/each}}             </ul>         {{else}}             <li>no chapters</li>         {{/each}}     </ul> 

i struggling come proper way generating route given section output effect of:

e.g:

book/1234567/chapter/3/section/4 chapter 3, section 4

book/1234567/chapter/1/section/2 chapter 1, section 2

one, not sure how access index of current chapter , section create link for, , two, not sure how create nested route given section.

i still quite new ember tips here helpful.

you should use ember.route's serialize , model methods handle url, , send section link to.

use {{#link-to 'book.section' book section}}

and in route:

app.sectionroute = ember.route.extend({   model: function(params) {       var book = this.modelfor('book');       return book.getchapter(params.chapter_num).getsection(params.section_num);   },    serialize: function(section) {       return {            chapter_num: section.get("chapter.id"),           section_num: section.get("id")       };   } }); 

hope helps.