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.

```
<script type="text/x-handlebars" data-template-name="accountItem">
{{#each account in controller}}
    {{#view App.AccountView}}
        <h4>{{account.name}}</h3>
        <img {{bindAttr src="account.icon"}} />
        <i {{bindAttr class="account.provider"}}></i>
    {{/view}}
{{/each}}
</script>

App.AccountView = Ember.View.extend({
    tagName: 'a',
    classNames: ['avatar-image'],
    providerClass: function(el) {
        // do something
    }
});

```

The question I have is two-fold.

1. How do you pass in "account", or the currently iterated item, into the view?
2. After you pass it in, how do you reference it?

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?