3

HTML で次のテンプレートを定義しています。

<script type="text/x-handlebars" data-template-name="application">
    <div>
        <p>{{outlet}}</p>
    </div>
</script>

<script type="text/x-handlebars" data-template-name="registration">
    <form autocomplete="on">
        First name:<input type='text' name='firstName'><br>
        Last name: <input type='text' name='lastName'><br>
        E-mail: <input type='email' name='primaryEmailAddress'><br>
        Password: <input type='password' name='password' autocomplete='off'><br>
        <button type='button' {{action 'createUser'}}>Register</button>
    </form>
</script>

私のJavaScriptは次のとおりです。

App.UsersController = Ember.ObjectController.extend({
    createUser : function () {
        var name = this.get('firstName');
    }
});

フォームのボタンをクリックすると、「createUser」関数が呼び出されます。ただし、フォームから値を読み取ることができません。

私の見解は次のとおりです。

App.UsersView = Ember.View.extend({
    templateName : 'registration'
});

コントローラーとテンプレートが関連付けられていることに感謝していますが、このシナリオでは他の値が表示されません。他に何か提供されますか?

4

1 に答える 1

2

入力フィールドの値をコントローラーのどのプロパティにもバインドしなかった理由は、Ember の組み込みEmber.TextFieldを次のように使用できるためです。

<script type="text/x-handlebars" data-template-name="registration">
  <form autocomplete="on">
    <!-- 
        The valueBinding="firstName" binds the value entered by the user in the
         textfield to the property firstName in the controller
    -->
    First name:{{view Ember.TextField valueBinding="firstName"}}<br>
    Last name:{{view Ember.TextField valueBinding="lastName"}}<br>
    E-mail:{{view Ember.TextField valueBinding="email"}}<br>
    Password: {{view Ember.TextField valueBinding="password" type="password"}}<br>
    <button type='button' {{action 'createUser'}}>Register</button>
  </form>
</script>

アクセスできるようになりました

App.UsersController = Ember.ObjectController.extend({
  createUser : function () {
    alert(this.get('firstName'));
    alert(this.get('lastName'));
    alert(this.get('email'));
    alert(this.get('password'));
  }
});

フィドル: http://jsfiddle.net/QEfCG/4/

于 2013-03-07T07:04:00.690 に答える