Created
December 9, 2013 17:36
-
-
Save tpitale/7876501 to your computer and use it in GitHub Desktop.
Notes on "complex" nested routes/urls/views in Ember
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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'); | |
}) | |
}); | |
}); | |
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
+--------------------------------------------------------------------------------------------------+ | |
|+--------------------------------------------------------++--------------------------------------+| | |
||+------------------------------------------------------+||+------------------------------------+|| | |
||| |||| ||| | |
||| 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