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 回答