Question

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

我正在制作一个视图，将ArrayController的内容显示为一个表格。 ArrayController列出了要显示的属性名称（columnsMeta）。在模板中，我查看控制器中的所有项目，然后遍历所有列，并希望和绑定列值。

尝试制作一个把手助手来获取属性值：

Ember.Handlebars.registerBoundHelper('getProperty', function(property, obj) {
    return obj.get(property);
});

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

{{#each row in controller}}
    <tr>
    {{#each col in columnsMeta}}
        <td>{{getProperty col.property row}}</td>
    {{/each}}
    </tr>
{{/each}}

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

这些符号也不起作用：

{{row.[col.property]}}
{{row.[(col.property)]}}

名称为“col.property”的属性不存在，也没有打印任何内容。

我看到ember-table项目使用contentDidChange并在视图中创建一个计算属性，以便为模板提供单元格内容。 Table Cell View in ember-table

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

谢谢！

Answer 1

一种解决方案可能是将逻辑移出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    
});

查看代码：

<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>

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

1 个答案: