Custom AngularJS directive including a dash in the name doesn't work

Question

I\'ve written the following Angular directive that will add the \"required\" attribute to all children:

.directive(\"requireall\", function($compile) {
  ret         


        

Answer 1

Rename the directive to "requireAll";

.directive("requireAll",…)

And a directive named abcDef can be used as abc-def in the markup.

Answer 2

Angular converts camelCasing to snake-casing, so your requireall directive needs to be renamed to requireAll, then you can use require-all in your markup (or data-require-all if you want to correctly markup custom tags). Confused me for a while at first.