Ember.js: link-to does not support custom data attributes

[ultimatedelman]

I would like to be able to add whatever attributes I want to my links, like so:

{{#link-to "my-route" class="my-class" data-my-attr="my-attr"}}My Link{{/link-to}}

Expected output:

<a href="/my-route" class="my-class" data-my-attr="my-attr">My Link</a>

CC: @nathanhammond

[ultimatedelman]

Apparently this is just an insane design decision. Rescinded.

[ultimatedelman]

Y'know, I'm going to reopen this for discussion. I would love to hear why you would make such a useful thing that is supported natively by HTML5 so difficult to implement.

[mixonic]

I would love to hear why you would make such a useful thing that is supported natively by HTML5 so difficult to implement.

0_o There is no "why we made it difficult". We definitely didn't try to make anything in particular difficult.

Ember currently uses a whitelist of attributeBindings to decide what is bound to a components element. You can optionally re-open LinkView to add attributeBindings of your own. However I don't think anyone finds that to be an ideal solution, and we're exploring the idea of having any attribute that has a string value set an attribute.

[cwarny]

I agree that this would be useful. Is there a good reason I'm missing for whitelisting attributeBindings?

[ultimatedelman]

I just don't understand why the solution listed on the documentation isn't just there by default.

[vanor89]

Was this ever discussed? I can't help but agree, I feel that by having to route in an action called by the button just because I want to add data-attributes to add functionality such as bootstrap's simple tooltips i'm doing something really dumb. Am I in fact being really dumb and should do this another way?

[locks]

@CarlosV89 https://github.com/emberjs/ember.js/issues/11358#issuecomment-109446594

[jhilden]

Another use case for why one would want to set data attributes on link-to elements is in order to be able to use https://github.com/simplabs/ember-test-selectors which relies on data-attributes.

[locks]

We are currently experimenting with a router service, meaning not necessarily using link-to. The way to address the problem is still the same as well, which is to extend link-to.

We are also experimenting with different semantics for Glimmerjs components, where we can distinguish between attributes that should be reflected in the DOM and arguments passed to the component.