ケバブ-ケースの角2つのセレクタ（tslint）で

Question

これは私のtslint.jsonファイルです：私はケバブ-ケースを設定するコンポーネントセレクタ名を持っている

{ 
    "rulesDirectory": [ 
    "node_modules/codelyzer" 
    ], 
    "rules": { 
    "class-name": true, 
    "comment-format": [ 
     true, 
     "check-space" 
    ], 
    "curly": true, 
    "eofline": true, 
    "forin": false, 
    "indent": [ 
     true, 
     "spaces" 
    ], 
    "label-position": true, 
    "label-undefined": true, 
    "max-line-length": [ 
     true, 
     140 
    ], 
    "member-access": false, 
    "member-ordering": [ 
     true, 
     "static-before-instance", 
     "variables-before-functions" 
    ], 
    "no-arg": true, 
    "no-bitwise": true, 
    "no-console": [ 
     true, 
     "debug", 
     "info", 
     "time", 
     "timeEnd", 
     "trace" 
    ], 
    "no-construct": true, 
    "no-debugger": true, 
    "no-duplicate-key": true, 
    "no-duplicate-variable": true, 
    "no-empty": false, 
    "no-eval": true, 
    "no-inferrable-types": true, 
    "no-shadowed-variable": true, 
    "no-string-literal": false, 
    "no-switch-case-fall-through": true, 
    "no-trailing-whitespace": false, 
    "no-unused-expression": true, 
    "no-unused-variable": true, 
    "no-unreachable": true, 
    "no-use-before-declare": true, 
    "no-var-keyword": true, 
    "object-literal-sort-keys": false, 
    "one-line": [ 
     true, 
     "check-open-brace", 
     "check-catch", 
     "check-else", 
     "check-whitespace" 
    ], 
    "quotemark": [ 
     true, 
     "single" 
    ], 
    "radix": true, 
    "semicolon": [ 
     "always" 
    ], 
    "triple-equals": [ 
     true, 
     "allow-null-check" 
    ], 
    "typedef-whitespace": [ 
     true, 
     { 
     "call-signature": "nospace", 
     "index-signature": "nospace", 
     "parameter": "nospace", 
     "property-declaration": "nospace", 
     "variable-declaration": "nospace" 
     } 
    ], 
    "variable-name": false, 
    "whitespace": [ 
     true, 
     "check-branch", 
     "check-decl", 
     "check-operator", 
     "check-separator", 
     "check-type" 
    ], 

    "directive-selector-prefix": [false, "app"], 
    "component-selector-prefix": [false, "app"], 
    "directive-selector-name": [true, "camelCase"], 
    "component-selector-name": [false, "kebab-case"], 
    "directive-selector-type": [true, "attribute"], 
    "component-selector-type": [true, "element"], 
    "use-input-property-decorator": true, 
    "use-output-property-decorator": true, 
    "use-host-property-decorator": true, 
    "no-input-rename": true, 
    "no-output-rename": true, 
    "use-life-cycle-interface": true, 
    "use-pipe-transform-interface": true, 
    "component-class-suffix": true, 
    "directive-class-suffix": true 
    } 
} 

。 lintを実行すると、コンポーネントに「CommComComponent」というコンポーネントのセレクタの名前をkebab-caseとする必要があります。

しかし、私はコンポーネント定義に行くとき、これはそれが何であるかです：

@Component({ 
    selector: 'admin', 
    templateUrl: 'admin.component.html', 
    styleUrls: ['admin.component.css'], 
    providers: [] 
}) 

セレクタは、1つの単語だけで、ケバブ・ケースセレクタを必要としません...私はどのように修正することができますこの？

Answer 1

この警告を防ぐために方法を知っていますが、セレクタ名に独自の接頭辞を使用する必要があり、公式アンギュラスタイルガイドにに関してはいけない：

https://angular.io/styleguide#02-07

は用のカスタム接頭辞を使用していますコンポーネントセレクタ。たとえば、接頭辞tohはTour of Heroesを表し、接頭辞adminは管理機能領域を表します。

なぜですか？他のアプリケーションのコンポーネントやネイティブHTML要素との要素名の衝突を防ぎます。