0

我最近正在使用 Ember-CLI (0.2.0) 并且正在测试一个从生成器构建的简单 Helper。

Helper 完成了它的工作，但问题是所使用的变量是无界的，并且当它的值发生变化时不会反映在 UI 中。

helper 是一个 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是项目对象的属性名称，其值可以是可变的。

提前致谢

4

1 回答 1

0

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

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}}
于 2015-04-16T19:00:29.737 回答