I posted a question in stack overflow, but perhaps this is a better place for it. I’ll explain the details here, but the SO question is here.
I have a route “seating-plan”. It loads 3 models, the “student”, the “objective” and the “score”. The “seating plan” is a GUI for viewing each “student” and their “score” for the given “objective”. The particular “objective” is chosen by a select form at the top of the page, which will then load the “score” for each student for that “objective”.
I made a simple version with a single score as part of the “student” model (no objective or score models). I now want to develop this so that the appropriate student’s score is loaded from the “score” model via the selected “objective”.
I’m struggling to work out how I should do this in Ember. I’ve added the relationships to the models, but don’t know how to set up interactions based on these relationships. I’ve tried to read up, but all the concepts in guides are given in a very linear and straightforward way. Hope this makes enough sense - I’d really appreciate some general advice about the way to do this. Thanks
Simple example:
https://github.com/lfridael/ember-student-example
Most relevant parts are the models and the routes:
https://github.com/lfridael/ember-student-example/tree/master/app/models
https://github.com/lfridael/ember-student-example/tree/master/app/routes
It’s quick-and-dirty code of course, but it should illustrate the basics of how model relations may work. In this case I chose a query param to represent the objective selection, but you could also make a dedicated “objective” route.
Thanks so much for taking the time to do this. Couldn’t do this without the help of you and others. I’ve just taken a quick look, and have a little figuring out to do. Quick question though, I’m hoping to keep this all within a single route, eg www.abcde.com/seating-plan, (maybe have a dynamic class name segment at some later stage). Would I need to adapt this and use a {{view}} or {{render}} ?
Routes represent application state. In general, I would make routes as specific as possible and avoid putting too much responsibility into any single route. The routes effectively form a map of your application.
Using a dynamic class segment in your routes may save you some time in the short run, but the disadvantage is that you (or someone else) can’t easily reason about your application state later on. (Having said that, there could be valid use cases for “catchall” routes, for example when your application’s models are dynamically generated at runtime.)
If in doubt, use {{render}} instead of {{view}}. Views are best used for DOM manipulation and raw event handling.
Background: views were important back in the Ember 1.0 days, but are now considered to be an implementation detail and have been mostly superseded by components. The main difference being that components are geared towards reusability, while views are specific to the application. For newcomers the Ember docs may not accurately reflect the now-recommended component-oriented approach.
Yeah I get what you’re saying with routes. Its just in this case, I want to be able to see and access to manipulate all the students score’s at the same time from the same route. I’ll have a little play with using {{render}}. A big thanks again!