Angular directive name: only lower case letters allowed?

angularjs, angularjs-directive

Solution

AngularJS attempts to make everyone happy!

Some people prefer to use data attributes, like `data-abc-abc`, I assume to keep validators happy. Other people prefer to use namespaces like `abc:abc`, and others prefer to use the actual directive name `abcAbc`. Or even all caps `ABC_ABC`. Or extension attributes like `x-abc-abc`.

AngularJS normalises the name used in HTML to attempt to cover all of these cases. `data-` and `x-` are stripped, the remainder camelcased with `:`, `-` and `_` as word boundaries. This makes `abcAbc` from the cases mentioned above, which is used to look up the directive declared in JavaScript.

This is all called attribute normalisation (US: attribute normalization) and can be found in the AngularJS documentation and source code.

Problem

My code: ``` app.directive('abcabc', function (){ alert('directive');}); // working ``` but ``` app.directive('abcAbc', function (){ alert('directive');}); // not working ! app.directive('abc-abc', function (){ alert('directive');}); // not working ! ``` Am I doing wrong? Or there are special naming rules for Angular directive?

Original source