title: Ember.js: Passing model into view
body: <p>I have a controller with data about user accounts (icon, name, provider, etc.). Within the output of the each loop I have a view that will build a CSS class dynamically based on the provider passed in via that specific model.</p>
  
  <pre><code>&lt;script type="text/x-handlebars" data-template-name="accountItem"&gt;
  {{#each account in controller}}
      {{#view App.AccountView}}
          &lt;h4&gt;{{account.name}}&lt;/h3&gt;
          &lt;img {{bindAttr src="account.icon"}} /&gt;
          &lt;i {{bindAttr class="account.provider"}}&gt;&lt;/i&gt;
      {{/view}}
  {{/each}}
  &lt;/script&gt;
  
  App.AccountView = Ember.View.extend({
      tagName: 'a',
      classNames: ['avatar-image'],
      providerClass: function(el) {
          // do something
      }
  });
  </code></pre>
  
  <p>The question I have is two-fold.</p>
  
  <ol>
  <li>How do you pass in "account", or the currently iterated item, into the view?</li>
  <li>After you pass it in, how do you reference it?</li>
  </ol>
  
  <p>I'm sure this is something that happens quite often but I can't seem to find any examples. Can anyone offer some input on this please?</p>