JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://builds.emberjs.com/handlebars-1.0.0.js"></script>
<script src="http://builds.emberjs.com/ember-latest.js"></script>
<script type="text/x-handlebars" data-template-name="emails">
    <ul>
        {{#each itemController="email"}}
            {{view App.EmailView}}
        {{/each}}   
    </ul>
    <button {{action "checkAllEmails"}}>Check All</button>
</script>

<script type="text/x-handlebars" data-template-name="email">                 
    {{id}} - {{text}}  
    {{input type="checkbox" checked=isChecked}}
</script>

JavaScript

App = Ember.Application.create();

App.IndexRoute = Ember.Route.extend({
  redirect: function() {
    this.transitionTo('emails');
  }
});

App.Router.map(function() {
  this.resource('emails');
});

App.EmailsRoute = Ember.Route.extend({
  model: function(){
      return [
          {id: 1, text: 'Email1'},
          {id: 2, text: 'Email2'},
          {id: 3, text: 'Email3'}
      ];
  }   
});

App.EmailsController = Ember.ArrayController.extend({
    itemController: 'email',
    actions: {
  		checkAllEmails: function() {
            this.forEach(function(email) {
                email.toggleProperty("isChecked");
            });
  		} 
  	}
});

App.EmailController = Ember.ObjectController.extend({
  //isChecked: true, // this is creating a static property shared across all Email instances
});

App.EmailView = Ember.View.extend({
	templateName: 'email',
	tagName: 'li'
});