title: Ember.js - multiple components on a page
body: <p>I'm trying to build an Ember app and I'm running into some difficulty.</p>
  
  <p>I have an index route, which I want to render the following page:</p>
  
  <pre><code>+--------------------------+
  |   Welcome, foo@bar.com   |
  +--------------------------+
  |                          |
  |        New Posts         |
  |        ---------         |
  |          *foo            |
  |          *bar            |
  |          *baz            |
  |                          |
  +--------------------------+
  </code></pre>
  
  <p>So I have an <code>Account</code> model, and a <code>Post</code> model. (which don't have any related fields)</p>
  
  <p>I'm having conceptual difficulty with the following:</p>
  
  <p>Ember routes have a <code>model</code> method which returns the model for the route. But what if I want multiple models to be associated with my route? In this case I have <code>Account</code> and <code>Post</code>. How do I make them <em>both</em> available to my page?</p>
  
  <p>One thing I've tried is using <code>setupController</code> and manually setting <code>account</code> and <code>posts</code> on the controller so they can be accessed by the template. But if I can do this, what's the point/significance of the <code>model</code> method!?</p>
  
  <p>Why does Ember want to associate a route with only a single model?</p>
  
  <p>Appreciate any advice,</p>
  
  <p>Thanks,
  Daniel</p>