0

我有一个具有以下属性和计算属性的控制器。

import Ember from 'ember';

export default Ember.Controller.extend({
  emailAddress: '',
  messageBody: '',

  validEmail: Ember.computed.match('emailAddress', /^.+@.+\..+$/),
  validMessage: Ember.computed.gte('messageBody.length', 5),

  enableSend: Ember.computed.and('validEmail', 'validMessage'),
  disableSend: Ember.computed.not('enableSend')
});

该控制器与一个简单的表单相关联,该表单具有电子邮件输入字段和文本框。我想在启用提交按钮之前检查电子邮件输入和文本框是否有效。

上面的代码工作得很好,但是,似乎必须有一种方法可以将逻辑enableSenddisableSend

显然你不能在计算属性上链接方法,但这样的事情是有道理的:

Ember.computed.and.not('validEmail', 'validMessage')

这可能是一个愚蠢的问题,但我如何确定两个值是否为假而不必编写两个计算属性?

4

2 回答 2

1

写下计算的属性:

disableSend: Ember.computed('validEmail', 'validMessage', function() {
  return this.get('validEmail') && this.get('validMessage');
})
于 2016-03-17T00:00:22.300 回答
0

这是 JS 代码的重构版本:

emailAddress: '',
messageBody: '',

validEmail: Ember.computed.match('emailAddress', /^.+@.+\..+$/),
validMessage: Ember.computed.gte('messageBody.length', 5),

//Return the opposite to make "disabled" false
isDisabled: Ember.computed('messageIsValid','emailIsValid', function(){
  return !(this.get('messageIsValid') && this.get('emailIsValid'));
})

在 hbs 文件中,您需要这样的内容:

  <button disabled={{isDisabled}}>Send message</button>
于 2017-03-21T09:13:36.853 回答