Ember-自定义计算属性,用于检查是否存在所有依赖字段
Ember - Custom Computed Property to check if all dependent fields exists
我正在创建一个表单,并试图找到一种简单、优雅的处理方式来查看是否存在所有输入。
Form = Ember.Object.extend({
// section 1
name: null,
age: null,
isABoolean: null,
// section 2
job: null,
numberOfSiblings: null,
isComplete: Ember.computed.and('_isSection1Complete', '_isSection2Complete'),
_isSection1Complete: function() {
var isPresent = Ember.isPresent;
return isPresent(this.get('name')) && isPresent(this.get('age')) && isPresent(this.get('isABoolean'));
}.property('name', 'age', 'isABoolean'),
_isSection2Complete: function() {
var isPresent = Ember.isPresent;
return isPresent(this.get('job')) && isPresent(this.get('numberOfSiblings'));
}.property('job', 'numberOfSiblings')
});
然而,这似乎并没有扩大规模。我的实际申请会有很多部分(超过20个部分)。
我正在考虑尝试创建一个可重复使用的计算属性,以满足我的需求。以我想要的代码为例:
Form = Ember.Object.extend({
// properties...
isComplete: Ember.computed.and('_isSection1Complete', '_isSection2Complete'),
_isSection1Complete: Ember.computed.allPresent('name', 'age', 'isABoolean'),
_isSection2Complete: Ember.computed.allPresent('job', 'numberOfSiblings')
});
我觉得这是一种常见的情况,但我无法找到正确的计算属性来执行它,所以我想自己制作。
两个问题:
- 定义自定义计算属性的最佳位置在哪里?我可以给
Ember.computed
附加一个函数吗 - 有没有更简单的方法来解决这个问题?我觉得我忽略了一些简单的事情
关于问题#1,
您可以在App
命名空间中定义自定义计算辅助对象。在本例中,我创建了一个名为allPresent
的新计算帮助程序,该帮助程序根据Ember.isPresent
检查传入的每个属性。
App.computed = {
allPresent: function (propertyNames) {
// copy the array
var computedArgs = propertyNames.slice(0);
computedArgs.push(function () {
return propertyNames.map(function (propertyName) {
// get the value for each property name
return this.get(propertyName);
}, this).every(Ember.isPresent);
});
return Ember.computed.apply(Ember.computed, computedArgs);
}
};
它可以这样使用,根据您的示例代码:
_isSection2Complete: App.computed.allPresent(['job', 'numberOfSiblings'])
我根据这里的方法进行了调整:http://robots.thoughtbot.com/custom-ember-computed-properties
至于问题2,我想不出更简单的解决方案了。
我不得不对Evan的解决方案进行小的调整,但这对其他需要它的人来说非常有效:
App.computed = {
allPresent: function () {
var propertyNames = Array.prototype.slice.call(arguments, 0);
var computedArgs = propertyNames.slice(0); // copy the array
computedArgs.push(function () {
return propertyNames.map(function (propertyName) {
// get the value for each property name
return this.get(propertyName);
}, this).every(Ember.isPresent);
});
return Ember.computed.apply(Ember.computed, computedArgs);
}
};
现在可以这样使用:
_isSection2Complete: App.computed.allPresent('job', 'numberOfSiblings')
相关文章:
- Javascript-如何读取json文件中的列并将其保存在Javascript数组中
- 如果使用 lodash 将属性存在于另一个对象中,则向对象添加属性
- Jquery菜单操作不稳定,定位不正确,存在一般错误
- 在自定义mean.io包中使用angular-chart.js作为依赖项
- 为什么Airbnb风格指南说不鼓励依赖函数名称推断
- 如何使用Spring MVC将Facebook返回的响应数据保存在Java类中
- 用于检查数组中是否存在元素的javascript自定义方法
- 未捕获的类型错误:无法读取属性'name'即使它存在,也无法定义
- 将依赖外部库的UMD模块与browserfy捆绑在一起
- 正在将事件处理程序添加到不存在的类
- 如何将本地依赖项添加到npm项目中
- 是否存在React Native“;WEB代码安全防护”;
- 一个密码测试程序,如果存在空格,它会提醒用户
- 验证会话中是否存在对象's数组
- javascript如果图像不存在don't加载它
- 如何在内联依赖项并将图像转换为dataURI的情况下完全提取网页
- 如何查找值是否存在于二叉树中
- IE9的HTML5 Canvas getImageData()函数存在问题
- Ember-自定义计算属性,用于检查是否存在所有依赖字段
- Jest 无法构建依赖关系图,源文件和构建文件之间存在冲突