Ember.js bindAttr

HTML

<script src="https://github.com/downloads/emberjs/ember.js/ember-0.9.1.min.js"></script>
<script type="text/x-handlebars">
    {{#view App.TodoView}}
        <div {{bindAttr class="todo isDone"}}>
            This does not have a "todo" class
        </div>
        <div class="todo" {{bindAttr class="isDone"}}>
            This does not have an "is-done" class
        </div>
    {{/view}}
    {{#view App.SadTodoView}}
        <div {{bindAttr class="todo isDone"}}>
            This has both classes because I added an unnecessary property
        </div>
    {{/view}}
</script>

JavaScript

App = Ember.Application.create();

App.TodoView = Ember.View.extend({
    isDone: true
});

App.SadTodoView = Ember.View.extend({
    isDone: true,
    todo: "todo"
});