TextField change binding

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js"></script>
<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-1.0.pre.js"></script>
Binding and calculated property work immediately.</br>
Type in field
<script type="text/x-handlebars">
  {{#view App.Form controllerBinding="App.peopleController"}}
    {{view Em.TextField valueBinding="App.peopleController.textFieldValue"}}
    {{#if App.peopleController.formDirty}}
        <button type="submit">Add</button>
    {{/if}}
  {{/view}}
  <ul>
    {{#each App.peopleController}}
      <li>{{name}}</li>
    {{/each}}
  </ul>
</script>

JavaScript

window.App = Ember.Application.create();

App.peopleController = Em.ArrayController.create({
    content: [{name: "Joe"}, {name: "Jane"}],
    textFieldValue:null,
    formDirty: function(){
        return(!Em.empty(this.textFieldValue));    
    }.property('textFieldValue'),
    addPerson: function() {
        this.unshiftObject(App.Person.create({name: this.textFieldValue}));
    }
});

App.Person = Em.Object.extend({
    name: null
});       

App.Form = Em.View.extend({
    tagName: 'form',
    controller: null,
    
    submit: function(event) {
      event.preventDefault();
      this.get('controller').addPerson();
      this.get('controller').set('textFieldValue',null);
    }
});