How to handle multiple outlets in one single page


#1

Hello. I have a little problem about render|partial|view, outlet case.

I have a site with a this kind of layout

  • Autors (list of all autors name and avatar)
  • Albums (list of all albums)
  • display the first (or later the selected) album with the author (name and avatar)
  • Genres (list of all genres)
  • display of first (or later the selected) genre with all the albums
    • display of first (or later the selected) album with author (name and avatar) from the genre

Mockup of page layout

Issue 1: What is the best practice to handle this kind of model-tree?

Issue 2: I want to change and display that part of album what is selected from a Genres - genre (all albums from selected genre) - album (selected from all albums from selected genre) What is the best method if I want to keep the rest of the page without change? (In this case the URL only have to represent the last user action, not need to keep all the changes after refresh)


#2

That’s kind of against Ember standards. Tom and Yehuda really preach the importance of the URL. The URL in the address bar should represent the page the user is viewing.

That being said, I’m not positive how you’d generate the router so you could handle both of them at the same time.

You could disable the location all together and have two (or three) instances of ember running, one for each area on the page Example of multiple ember apps.

App.Router.reopen({
   location: 'none'
});

#3

Thank you for the answer, it’s helped. It our team, we discuss a lot of the ember.js policies & possibilities. Since we have a business client with an accepted layout, we want to find the best base solution for the project.

Personally I think that is not against the world if the user want to see more separate functions in one page, when it’s related to each other. On this case especially it’s over than ‘make sense’, it seems a ‘great and comfy idea’. ((Somehow I really successful to find that kind of edge cases… ))

In this situation, the final route and URL should keep intact, so the

  • album/[id]
  • author/[id]
  • albums

URL still exist, should work - and after refresh, it’s enough to display in one place, so I think the base concept of ember.js is still remain intact, the problem is the displaying the different results on same page.

I really hope that I can find an easy and practical way to handle this, the ember.js is a kind of next step forward.