Search code examples
dartdart-polymerpolymerangular-dart

Why does Angular not need a dash in component name

I wondered why Polymer elements need a dash in custom elements name like <my-component> while this is not necessary for Angular components especially as Angular components also use ShadowDOM.

** Edit** It doesn't even seem to be suggested good practice in Angular.

Solution

  • The HTML spec allows you to use unknown tags (<tab>, <panel>) without the HTML parser throwing a fit. To their benefit, Angular uses this behavior for their directives to make the components like native.

    Tags that don't have a - inherit from HTMLUnknownElement. There's a good explanation of the upgrade process here: HTML5Rocks - Custom Elements - How elements are upgraded

    Since Angular directives were designed in a time before the Custom Elements spec existed, they don't use a -. It's the standard that requires element names contain a -.