Same route nested in multiple resources ember.js
- by Daniel Upton
I'm building an ember.js app which has a model called "Programme".
A user can drill down to a programme by going:
Genre > Subgenre > Programme or Folder > List > Programme
Here's my router:
this.resource('mylists', { path: '/' }, function() {
this.resource('folder', { path: '/folder/:folder_id' }, function() {
this.resource('list', { path: '/list/:list_id' }, function() {
this.resource('programme', { path: '/programme/:programme_id' });
});
});
});
this.resource('catalogue', function() {
this.resource('genre', { path: '/genre/:genre_id' }, function() {
this.resource('subgenre', { path: '/subgenre/:subgenre_id' }, function() {
this.resource('programme', { path: '/programme/:programme_id' });
});
});
});
The UI needs to be deeply nested (the genre view renders in the outlet of the catalogue template, the subgenre in the outlet of the genre template... and so forth).
The problem I have is as both generated routes are called ProgrammeRoute when I linkTo the programme route inside the list template, it actually goes to the programme route nested in the subgenre route.
What should I be doing here?
To work around it I've named one route ListProgrammeRoute and SubgenreProgrammeRoute but that leads to some duplication.
