如何将把手绑定到任意属性?

Nol*_*and 5 handlebars.js ember.js

我正在尝试绑定控制器的属性,但属性名称本身存储为控制器的另一个属性.我需要在设计时不知道属性名称的情况下绑定到属性.这可能吗?或者什么是更好的做事方式?

我正在创建一个显示ArrayController作为表的内容的视图.该ArrayController有一个列表会将需要显示的属性名称(columnsMeta).在模板中,我查看控制器中的所有项目,然后循环遍历所有列,并希望获取绑定列值.

一种尝试是制作一个把手帮助器来获取属性值:

Ember.Handlebars.registerBoundHelper('getProperty', function(property, obj) {
    return obj.get(property);
});
Run Code Online (Sandbox Code Playgroud)

然后在模板中,将属性名称和对象传递给帮助程序:

{{#each row in controller}}
    <tr>
    {{#each col in columnsMeta}}
        <td>{{getProperty col.property row}}</td>
    {{/each}}
    </tr>
{{/each}}
Run Code Online (Sandbox Code Playgroud)

这将在表格中输出正确的文本,每个文本都被metamorph标签包围,但是当我更改模型属性的值时,模板不会更新,看起来实际上没有绑定.

这些符号也不起作用:

{{row.[col.property]}}
{{row.[(col.property)]}}
Run Code Online (Sandbox Code Playgroud)

名称为"col.property"的属性不存在,并且不打印任何内容.



我看到ember-table项目contentDidChange在视图中使用并创建了一个计算属性,以便为模板提供单元格内容.表格单元视图在ember表中

但这真的有必要吗?有没有那么沉重的方式?我的语法错了吗?

谢谢!

Tre*_*Dev 2

一种解决方案可能是将逻辑从 registerBoundHelper 移出并移至 ObjectController

控制器代码

App.ColController = Ember.ObjectController.extend({
  needs: ["row"],
  getProperty: function () {
      return this.get('controllers.row.' + this.get('property'));
   }.property('controllers.row.foo', 'controllers.row.bar'),  //this solution may not work if one does not have a finite known set of properties to observe    
});
Run Code Online (Sandbox Code Playgroud)

查看代码:

<script type="text/x-handlebars" data-template-name="row">
   {{#each row in controller}}
     <tr>
      {{#each col in columnsMeta}}
         {{render 'col' col}}
      {{/each}}
      </tr>
  {{/each}}
</script>

<script type="text/x-handlebars" data-template-name="col">
   <td>{{getProperty}}</td>
</script>
Run Code Online (Sandbox Code Playgroud)