I'm trying make a binding to property of the controller but the property name is itself stored as another property of the controller. I need to bind to a property without knowing the property name at design-time. Is this possible? Or what is the better way to do things?
I'm making a view that displays the content of an ArrayController
as a table. The ArrayController
has a list a property names it wants displayed (columnsMeta
). In the template, I look through all the items in the controller then loop through all the columns and want to get and bind the column value.
One attempt is to make a handlebars helper to get the property value:
Ember.Handlebars.registerBoundHelper('getProperty', function(property, obj) {
return obj.get(property);
});
and then in the template, pass the property name and object to the helper:
{{#each row in controller}}
<tr>
{{#each col in columnsMeta}}
<td>{{getProperty col.property row}}</td>
{{/each}}
</tr>
{{/each}}
This outputs the correct text in the table and each piece of text is surrounded with metamorph
tags but when I change the values of the models' properties, the template does not update, it appears not to actually be bound.
These notations also do not work:
{{row.[col.property]}}
{{row.[(col.property)]}}
The the property by the name of "col.property" doesn't exist and nothing is printed.
I see that the ember-table project uses contentDidChange
and creates a computed property in the view to feed the template the cell contents. Table Cell View in ember-table
But is that really necessary? Is there less heavy way? Do I just have my syntax wrong?
thanks!