HTML5必需属性在Ember.js中不起作用

Question

我正在为我的Ember.js应用程序创建一个登录表单,并希望利用输入上的"required"属性来轻松进行客户端验证.但是,当我向提交按钮添加Ember操作时,似乎此验证不起作用.

例如:

<form class="form" role="form">
   <div class="form-group">
      <label class="sr-only" for="exampleInputEmail2">Email address</label>
      <input type="email" class="form-control" id="email" placeholder="Email address" required>
   </div>
   <div class="form-group">
      <label class="sr-only" for="exampleInputPassword2">Password</label>
      <input type="password" class="form-control" id="password" placeholder="Password" required>
   </div>
   <div class="checkbox">
      <label>
      <input type="checkbox"> Remember me
      </label>
   </div>
   <div class="form-group">
      <button {{action 'login'}} class="btn btn-success btn-block">Sign in</button>
   </div>
</form>

我删除{{action 'login'}}验证工作的那一刻,否则它没有.

我该如何解决这个问题？谢谢.

Answer 1

将操作添加到按钮将绕过表单提交过程,您将要将其添加到表单提交,并且只有在表单尝试提交时才会触发它.

<form class="form-horizontal" {{action "login" on="submit"}}>
  ...
</form>

http://emberjs.jsbin.com/tomolevi/1/edit