javascript - Ember.js 2.7 - 如何检查输入字段的验证？

Question

我对 Ember.js 还很陌生，但在如何对某个输入字段进行验证时遇到了困难。

这是我的模板index.hbs的代码:

<div class="jumbotron text-center">
  <h1>Coming Soon</h1>

  <br/><br/>

  <p>Don't miss our launch date, request an invitation now.</p>

  <div class="form-horizontal form-group form-group-lg row">
    <div class="col-xs-10 col-xs-offset-1 col-sm-6 col-sm-offset-1 col-md-5 col-md-offset-2">
      {{input type="email" value=model.email class="form-control" placeholder="Please type your e-mail address." autofocus="autofocus"}}
    </div>
    <div class="col-xs-10 col-xs-offset-1 col-sm-offset-0 col-sm-4 col-md-3">
        <button disabled={{isDisabled}} {{action 'saveInvitation' model}} class="btn btn-primary btn-lg btn-block">Request invitation</button>
    </div>
  </div>
  {{#if responseMessage}}
    <div class="alert alert-success">{{responseMessage}}</div>
  {{/if}}
  <br/><br/>
</div>

这是我的 Controller index.js 中的代码:

import Ember from 'ember';

export default Ember.Controller.extend({

  headerMessage: 'Coming soon',
  responseMessage: '',
  email: '',

  isValid: Ember.computed.match('email', /^.+@.+\..+$/),
  isDisabled: Ember.computed.not('isValid'),
});

我想要验证的输入字段是电子邮件字段。我知道如何通过将 value=""字段替换为 value="email"来进行验证，但我想知道如何使用 value=model.email

这似乎是一个简单的问题，但我在文档中找不到有关此特定问题的任何内容。

Answer 1

当您使用input 帮助程序时，当您在文本字段中键入内容时，这将更新model.email 属性。

1.您不需要在 Controller 中声明 email 属性。
2.isValid 计算属性依赖键应该是 model.email

import Ember from 'ember';

export default Ember.Controller.extend({

  headerMessage: 'Coming soon',
  responseMessage: '',

  isValid: Ember.computed.match('model.email', /^.+@.+\..+$/),
  isDisabled: Ember.computed.not('isValid'),
});