samedi 31 janvier 2015

Reusable master/detail view best practice ember

I've been grappling with this relatively simple problem in Ember JS in a variety of my apps. I know this may seem like its been answered seven ways to Sunday but I haven't found a solution that I can actually map to my problem.


Okay, so I need a class master/detail view with a route structure like:



  • Admin Dashboard

    • Dashboard

    • Students page (displays a master list of students in a sidebar)

    • Student page (upon selecting a sidebar item, it is selected and "details appears"




This pattern is reused exactly at three different dashboards in my site. The only difference is the record array of students is different for each one. I'm asking what is the most Ember-esque way to accomplish this?


I have tried multiple solutions but each one has its own problems. Using the {render} helper to render some universal "students" template breaks because I am leveraging the router and <li> tags inside to automatically apply the active class to the selected student, and students.student isn't a route in my router. If I add that route, then it routes away from the dashboard parent route (with the navbar, etc).


I basically want to package this view into a component almost and pass it the array to display, but then how do I add the "active" class? Surely there is an easier way then manually adding and removing the class.


Thoughts?


I apologize if my question isn't super clear! Its a subtle distinction.





Aucun commentaire:

Enregistrer un commentaire