组件“ AppFooterComponent”的选择器应用作元素

Question

我的应用程序的结构如下：

<body>
  <header>[...]</header>
  <main>[...]</main>
  <footer><app-footer></app-footer></footer>
</body>

由于我不需要不必要的DOM元素，因此我更喜欢将app-footer声明为属性，以便可以这样声明页面：

<body>
  <header>[...]</header>
  <main>[...]</main>
  <footer app-footer></footer>
</body>

但是如果这样做，执行ng lint时会收到以下错误消息

组件“ AppFooterComponent”的选择器应用作元素（ https://angular.io/styleguide#style-05-03 ）

我认为这种情况是该规则的合理例外。 你同意吗？ 如果是这样，我如何才能将此特定组件声明为该规则的例外？

Answer 1

定义@Component angular允许将该组件仅用作html元素。 如果要使用它作为元素的属性，请执行@Directive

import { Directive } from '@angular/core';

@Directive({
  selector: '[app-footer]'
})
export class AppFooter { 
   .....
}

文件

Answer 2

尽管这是一种不好的做法（根据样式指南），但是仍然可以为此特定组件禁用此ts lint特定规则。

为此，请在组件注释之前使用/ * tslint：disable：component-selector * /，以便组件声明如下所示：

/* tslint:disable:component-selector */
@Component({
    selector: '[app-footer]',
    templateUrl: './app-footer.component.html'
})
export class AppFooterComponent

组件“ AppFooterComponent”的选择器应用作元素

问题描述

2 个解决方案

解决方案1
1 2018-07-03 15:02:47

解决方案2
1 2019-05-01 20:08:41

组件“ AppFooterComponent”的选择器应用作元素

问题描述

2 个解决方案

解决方案1 1 2018-07-03 15:02:47

解决方案2 1 2019-05-01 20:08:41

解决方案1
1 2018-07-03 15:02:47

解决方案2
1 2019-05-01 20:08:41