EmberJS - 通过模板中的任意键访问对象的属性并使用HTMLBars绑定这些属性?

gal*_*ans 1 javascript ember.js

使用Handlebars我可以这样做:

<script type="text/x-handlebars" data-template-name="index">
  <table>
  {{#each model as |item index|}}
    <tr {{action 'update' index}}>
      {{#each col in columns}}
        <td>{{dd item col}}</td>
      {{/each}}
    </tr>
  {{/each}}
  </table>
</script>

App = Ember.Application.create();

App.IndexRoute = Ember.Route.extend({
  model: function() {
    return [
      { name: "Joe", description: "Good guy", age: 15 },
      { name: "Moe", description: "Bad guy", age: 25 },
      { name: "Dude", description: "Some other guy", age: 65 }
    ];
  }
});

App.IndexController = Ember.ArrayController.extend({
  columns : ['age', 'name', 'description'],
  actions: {
    update: function(index) {
      var item = this.get('model')[index];
      Ember.set(item, 'age', 10);
    }
  }
});

Ember.Handlebars.registerBoundHelper('dd', function(item, column) {
  return item[column];
}, 'age', 'name', 'description');
Run Code Online (Sandbox Code Playgroud)

这会绑定模型中每个项目的年龄,名称和描述属性,以便更改age属性更新模板.

但是现在HTMLBars是默认的,我不能这样做,因为似乎makeBoundHelper没有像HandleBars那样的dependentKeys参数.此帮助程序可以使对象正常,但在数据更改时不会更新:

App.ddHelper = Ember.HTMLBars.makeBoundHelper(function(params) {
  var item = params[0];
  var column = params[1];
  return item[column];
}, 'age', 'name', 'description');

Ember.HTMLBars._registerHelper('dd', App.ddHelper);
Run Code Online (Sandbox Code Playgroud)

那么如何通过模板中的任意键访问对象的属性并使用HTMLBars绑定这些属性?

jmu*_*yau 5

我创建了一个提供此功能的插件.

烬,获得辅助

它最近在核心Ember代码中被采用,因此在即将推出的版本中,您将不再需要安装该插件.. 有关详细信息,请参阅此PR.

对于可以重新计算除了帮助程序输入以外的其他东西的更高级的帮助程序,有一个开放的RFC来解决这个问题.留意它.