Skip to content

Instantly share code, notes, and snippets.

@tpitale tpitale/Notes.txt
Created Dec 9, 2013

Embed
What would you like to do?
Notes on "complex" nested routes/urls/views in Ember
In order to to add a new task for Problem 3 in the UI above, I'm hoping for a route that's something like `/problems/3/tasks/new`. This style is, of course, very much like what Rails uses.
Below is a cut down version of the router setup I'm using to to try to accomplish this URL structure. It seems strange to have a resource "problem" inside of a resource "problems", but the edit for that problem is ouside the individual problem, but inside of problems (plural).
Either way, all of this is structured in such a way as to give me the UI above, and the URL I'd like to use. To couple the UI and the URL together feels like it makes things very brittle in the router, and makes me fight against Embers' conventions.
App.Router.map(function() {
this.resource('problems', function() {
// ProblemsNewRoute
this.route('new');
// ProblemsEditRoute
this.route('edit', {path: '/:problem_id/edit'});
// Show
this.resource('problem', {path: '/:problem_id'}, function() {
this.resource('tasks', function() {
// TasksNewRoute tasks/new
this.route('new');
})
});
});
});
+--------------------------------------------------------------------------------------------------+
|+--------------------------------------------------------++--------------------------------------+|
||+------------------------------------------------------+||+------------------------------------+||
||| |||| |||
||| Problem 1 |||| Problem 3 Details |||
||| |||| |||
||+------------------------------------------------------+||| |||
||+------------------------------------------------------+||| |||
||| |||| |||
||| Problem 2 |||| |||
||| |||| |||
||+------------------------------------------------------+||+------------------------------------+||
||+------------------------------------------------------+||+------------------------------------+||
||| |||| Task 1 |||
||| Problem 3 |||| |||
||| |||+------------------------------------+||
||+------------------------------------------------------+||+------------------------------------+||
||+------------------------------------------------------+||| Task 2 |||
||| |||| |||
||| Problem 4 |||+------------------------------------+||
||| |||+------------------------------------+||
||+------------------------------------------------------+||| |||
||+------------------------------------------------------+||| New Task Form |||
||| |||| |||
||| Problem 5 |||| |||
||| |||| |||
||| |||| |||
||+------------------------------------------------------+||+------------------------------------+||
|+--------------------------------------------------------++--------------------------------------+|
+--------------------------------------------------------------------------------------------------+
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.