Data Attributes have a good place in this world (arguably, but that’s a point for a different thread maybe). It’s convenient to extend our tags with custom attributes without those tags having to know about them. Data-attributes decouples nicely the concerns (e.g. an anchor has an href, but doesn’t have a data-click-counter). In Ember, we have many other abstractions, but often we have to interact with libraries that expect those attributes.
The problem now is that if we want to use data-attributes inside a handlebars template, we need to add the data-attribute to the attributeBindings array. Even when this is simple, it seems like a violation of concerns. Look at the following example, my ButtonDropdown shouldn’t know anything about data-tracking-category.
PF.ButtonDropdown = Ember.View.extend(PF.ValidationSupport, PF.TooltipSupport, {
attributeBindings: ['data-element', 'data-qa', 'data-tracking-category', 'data-tracking-page'],
In a couple of previous apps, we re-opened view to any data-* attribute to attributeBindings. The code is simple:
var keys = Ember.keys;
Ember.View.reopen({
init: function() {
var dataAttributes, view;
this._super();
view = this;
dataAttributes = keys(view).filter(function(key) {
return key.match('^data-');
});
return view.get('attributeBindings').pushObjects(dataAttributes);
}
});
This is the third time I see the need for it. Would it make sense to make it part of Ember? What do you think?