Skip to content


Support for x-tag-names #1893

pluma opened this Issue · 4 comments

6 participants


I haven't looked through the entire code base, but in the tabs module I found that the checks for tab-heading look for an attribute called tab-heading or data-tab-heading or a tag also called tab-heading or data-tab-heading. The correct prefixed version of the tag name should probably be x-tab-heading (which is what web components will use), not data-tab-heading (which seems to have no basis as a tag name in the current HTML spec).

AngularJS is less strict about the distinction and simply strips x- and data- prefixes from attribute names and tag names alike. AngularUI should probably adopt this behaviour and simply accept x- prefixed attribute names and tag names in addition to the data- prefixed ones it already handles.

Maybe this logic could be factored out into a utility function.


Any examples of real use cases to justify the suggestions?


Angular spec for directive attributes support:

<span ng:bind="a" ng-bind="a" data-ng-bind="a" x-ng-bind="a">

Looking at the angular code, $normalize calls directiveNormalize which calls camelCase:

function camelCase(name) {
  return name.
    replace(SPECIAL_CHARS_REGEXP, function(_, separator, letter, offset) {
      return offset ? letter.toUpperCase() : letter;
   replace(MOZ_HACK_REGEXP, 'Moz$1');

Tab heading is a bit of an oddball in that it is trying to support attribute and tag declaration, relevant code:

function isTabHeading(node) {
  return node.tagName &&  (
    node.hasAttribute('tab-heading') ||
    node.hasAttribute('data-tab-heading') ||
    node.tagName.toLowerCase() === 'tab-heading' ||
    node.tagName.toLowerCase() === 'data-tab-heading'

I don't have a dog in this race any more because I have pretty much abandoned AngularJS at this point. If nobody else takes any interest, feel free to close this issue.

@rvanbaalen rvanbaalen added this to the Purgatory milestone
@rvanbaalen rvanbaalen added type: bug and removed needs: info labels
AngularUI member

I would classify this as a bug since the tabheading should support x- notation according to the Angular spec as @RobJacobs stated.

@wesleycho wesleycho added a commit that closed this issue
@wesleycho wesleycho feat(tabs): add support for `x-tab-heading`
- Add support for `x-tab-heading` attribute and element

Closes #4166
Fixes #1893
@wesleycho wesleycho closed this in 1abfd05
@tmcgee123 tmcgee123 pushed a commit to tmcgee123/bootstrap that referenced this issue
@wesleycho wesleycho feat(tabs): add support for `x-tab-heading`
- Add support for `x-tab-heading` attribute and element

Closes #4166
Fixes #1893
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.