mercredi 28 janvier 2015

Assigning a data attribute without a value to an Ember component

I'm relatively new to Ember and am incorporating Foundation 5 into an ember-cli app using the ember-cli-foundation-sass addon.


I'm building an Ember component for Foundation's topbar element, and I need to set a data-topbar on the nav like so:



<nav class="top-bar" data-topbar role="navigation">
<!-- ... -->
</nav>


Is there any way to add an attribute binding with no associated value in an Ember component?


The following adds the role attribute but not data-topbar:



// app/components/topbar-nav.js

export default Ember.Component.extend({
tagName: 'nav',
classNames: ['top-bar'],
attributeBindings: ['role', 'data-topbar'],
role: 'navigation',

didInsertElement: function() {
this.$().foundation();
}
});


Setting an arbitrary value for data-topbar, like 'data-topbar': 'foo', will set the attribute on the nav, but that's not what I need:



<nav class="top-bar" data-topbar="foo" role="navigation">
<!-- ... -->
</nav>


Thanks!





Aucun commentaire:

Enregistrer un commentaire