RFC: Allow attribute selectors for SVG

[SteveVanOpstal]

SVG does not allow the use of custom elements like HTML5 does. SVG's will not render the contents of a custom element (example). The solution for that is to use attribute selectors (angular/angular#1632 (comment)).

Current behavior
Codelyzer does not allow attribute selectors on components (Due to style guide 05-03):

@Component({
  selector: 'g[appCustom]'
  ...

[tslint] The selector of the component "CustomComponent" should be named kebab-case and include dash (https://goo.gl/mBg67Z) (component-selector)

Desired behaviour
A new config for SVG components:

"svg-component-selector": [
  true,
  "element",
  "app",
  "camelCase"
],

The style guide does not mention SVG components and how to handle them but this comment confirms that SVG support is intended.

Figuring out if a component is an SVG component is quite easy as Angular 2 requires the svg namespace to be given on the root element (angular/angular#7216 (comment)).

[mgechev]

Sounds like a good to have feature. I'll include it into the backlog.

Until it's implemented, you can disable the rule for this file/component.

[mgechev]

Lets close the issue for now and reopen it if there's more interest.

[yluijten]

@mgechev do you have any idea when this issue will be picked up?

[mgechev]

You can disable the codelyzer rule for a specific component.

[yluijten]

@mgechev can this one be reopened? Looks like there's enough interest for it.

[subramaniashiva]

I am facing the same issue. Would be happy if this reopened