angular 指令选择器和 tslint 之间的冲突

Question

我正在使用 angular 4 指令来定义一个 angular 属性指令。 但我想将此指令用作一个类。 我的定义是（它工作正常）：

@Directive({
  selector: '.input-field'
})

这是根据角度选择器定义（ .class之一）

但是我收到了一个 tslint 错误，如下所示：

有没有办法在不禁用 tslint 规则的情况下修复此错误？

Answer 1

在这种情况下，您的规则会阻止您使用类选择器，因此您必须禁用它。 问题是是否全局禁用它？

您可以在代码块中禁用特定规则，如下所示：

/* tslint:disable: no-use-before-declare */

some code breaking no-use-before-declare rule

/* tslint:enable: no-use-before-declare */

或者您可以为下一行禁用整个 tslint

// tslint:disable-next-line
some code breaking all the rules
normal code

Answer 2

要在同一个项目中验证多个前缀，您只需使用以下内容（在tslint.json文件中）：

...
"component-selector": [true, "element", ["app", "my-awsome-prefix", "another-prefix"], "kebab-case"],
...

指令也一样：

...
"directive-selector": [true, "attribute", ["app", "myDirectivePrefix"], "camelCase"],
...

Answer 3

我遇到了同样的错误并在GitHub 上打开了一个问题。 这是我得到的答案：

虽然 Angular 确实支持指令的类选择器，但这个特性应该只在特殊情况下使用，因为它很难理解模板的哪些部分是常规类，哪些是指令。 这就是为什么此语法是 tslint 警告而不是编译错误的原因。

如果您坚持使用这种选择器样式，您可以更改 tslint 配置，或者在代码中使用 tslint 忽略注释作为调用站点的前缀，但是如果您坚持使用属性选择器，您将让您和其他人的生活更轻松。

这不是很令人满意，但似乎没有办法解决。

Answer 4

就我而言，问题在于以下数组类型：

public dateFormats: Array<{ format: string, eq: string }> = [...];

不使用通用语法修复了错误。

我肯定会考虑从tslint迁移到eslint因为对 Angular CLI 的支持已停止。