[英]How to prevent rule `@angular-eslint/template/i18n` from linting `mat-icon` elements
I use the rule @angular-eslint/template/i18n
to lint elements in template that contains text node and doesn't have an i18n
attribute.我使用规则
@angular-eslint/template/i18n
对包含文本节点但没有i18n
属性的模板中的元素进行 lint。
The Angular Material mat-icon
elements use inner text to identify the icon key like this: Angular Material
mat-icon
元素使用内部文本来标识图标键,如下所示:
<mat-icon>menu</mat-icon>
As it contains text, it is being linted by eslint as well.因为它包含文本,所以它也被 eslint 检测。 Unfortunately, I couldn't find a way add exceptions to this rule to exclude some element tags like
mat-icon
不幸的是,我找不到一种方法来为这个规则添加例外来排除一些元素标签,比如
mat-icon
Here is the eslint config I am using:这是我正在使用的 eslint 配置:
{
"files": [
"*.html"
],
"extends": [
"plugin:@angular-eslint/template/recommended"
],
"rules": {
"@angular-eslint/template/i18n": [
"warn",
{
"checkId": false,
"checkText": true,
"checkAttributes": false
}
]
}
}
Since Angular 14.1 and the support of the SEO friendly ligature icons , you should change your mat-icon usage like so:由于 Angular 14.1 和SEO 友好连字图标的支持,您应该像这样更改您的 mat-icon 用法:
- <mat-icon>home</mat-icon>
+ <mat-icon fontIcon="home"></mat-icon>
This has the advantage of avoiding your i18n issue while also preventing your icon name to appear in Google search result page.这样做的好处是可以避免 i18n 问题,同时也可以防止您的图标名称出现在 Google 搜索结果页面中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.