I have a model that contains several html attributes (for a form, it can contain action, method, enctype, etc.)
Those parameters are fully optional (a fieldset may or maynot have a name or a form attribute), so there is no set list of attributes.
I’ve been trying to write a bind-attr like helper that could be use like:
<form {{html-attrs obj}}>
</form>
where obj would be a pojo whose keys and values are those of the attributes.
I’ve been trying several approaches, most of them follow this scheme:
- Get
bind-attrhelper (either by accessing it fromHandlebars.helpers['bind-attr']or by usingresolveHelper). - Deal with options (basically, deep-merging
options.hashand the object that is passed tohtml-attrs). - Returning whatever
bind-attrwould have returned given the options created in step 2.
I’ve been having problems both writing the helper and testing it.
While testing it, I’m using the technique used by @rwjblue here. When using this technique I cannot get hold of bind-attr as a property of Ember.Handlebars.helpers and when trying to used the resolveHelper way, there is no container in options.data.view to use.
My other big problem is I do not know how to pass binding and not-binding attributes to bind-attr
Current solution
My current solution is something much more simple. The helper looks like this in app/helpers/html-attrs.js
export function htmlAttrs(html) {
var obj = html.toObject();
var result = [];
for(var key in obj) {
result.push(key + "=\"" + obj[key] + "\"");
}
return new Ember.Handlebars.SafeString(result.join(' '));
}
export default Ember.Handlebars.makeBoundHelper(htmlAttrs);
For it to work, it needs to be called using the unbound helper:
<form {{unbound html-attrs obj}}>
</form>
Any hint on how to work out a solution?