Question

我最近使用的是Ember-CLI（0.2.0），正在测试一个由生成器构建的简单Helper。

Helper完成了它的工作，但问题是所使用的变量没有限制，并且其值的变化没有反映在UI中。

帮助程序是一个get属性，您可以向其传递属性名称（即变量并可以使用该项的任何名称）和一个对象，并返回该属性的值，该代码为：

// unbounded-get-property.js
import Ember from 'ember';

export function unboundedGetProperty(params) {
   var data = params[0];
   var name = params[1];
   return data.get(name);
}

export default Ember.HTMLBars.makeBoundHelper(unboundedGetProperty);

这就是使用

//some hbs
{{#each item in filteredList}}
   {{unbounded-get-property item propertyName}}
{{/each}}

与组件相同的事实很容易做到：

//bounded-get-property
import Ember from 'ember';
import layout from '../templates/components/bound-get-property';

export default Ember.Component.extend({
    layout: layout,

    valueDefinition: function() {
       Ember.defineProperty(this, 'value', Ember.computed.alias('item.' + this.get('propertyName')));
    }.on('init')
});

//bounded-get-property.hbs
{{value}}

//some hbs
{{#each item in filteredList}}
    {{bounded-get-property item=item propertyName=propertyName}}
{{/each}}

问题是，如果我们需要绑定属性，我们必须创建一个这样的组件？不能用帮手解决？我希望有人可以给我一些调查或学习的方向。

注意：

filteredList是模型的过滤版本，通过ember-data find方法在路线中设置
propertyName是项目对象的属性名称，其值可以是变量。

提前致谢

Answer 1

为什么要传递属性名称和模型？试试这个：

import Ember from 'ember';

export default Ember.HTMLBars.makeBoundHelper(function (ctx) {
    return Ember.String.capitalize(ctx[0]);
});

模板：

{{get-property model.name}}

最好的解决方案： - ）

{{#each item in filteredList}}
   {{item.propertyName}}
{{/each}}

如何在Ember中创建一个有界属性的帮助器？

1 个答案: