Angular ESLint规则@angular-eslint/template/alt-text报错求助：input[type=image]已配置替代文本相关属性仍无法消除告警

嘿，太懂这种明明按要求做了却还触发告警的烦躁感了！咱们一步步来排查解决这个问题：

首先先确认你已经做对的地方：你给input[type=image]加的alt="Start Button"是完全符合无障碍要求的有效替代文本，尝试的aria-label、aria-labelledby其实优先级低于alt，核心问题应该出在规则的识别逻辑或者配置上。

下面给你几个可行的解决方向：

方案1：升级Angular ESLint插件版本 #

有些旧版本的@angular-eslint/eslint-plugin-template存在bug，对input[type=image]的alt属性识别不准确。你可以把这个插件升级到最新稳定版，然后重新运行lint命令，大概率能解决这个误判问题。

方案2：补全语义声明与交互属性 #

虽然input[type=image]本身语义是按钮，但有时候ESLint的无障碍规则会希望更明确的声明，同时你一开始缺失的键盘交互也可以补上（刚好符合最初的无障碍要求），修改后的代码如下：

<input 
  type="image" 
  src="start-button.png" 
  alt="Start Button" 
  class="start-button" 
  role="button"
  (click)="startSequence()"
  (keydown.enter)="startSequence()"
  (keydown.space)="startSequence()"
/>

补上role="button"和键盘事件后，规则的语义检查会更顺畅，也能彻底满足无障碍的交互要求。

方案3：添加ESLint忽略注释（兜底方案） #

如果前面的方法都无效，且你确认自己的代码完全符合无障碍标准，可以在这个元素上添加忽略注释，跳过这条规则的检查：

<!-- eslint-disable-next-line @angular-eslint/template/alt-text -->
<input type="image" src="start-button.png" alt="Start Button" class="start-button" (click)="startSequence()"/>

不过这是临时方案，还是建议优先排查版本或语义声明的问题哦。

另外你也可以检查下ESLint配置文件（比如.eslintrc.json）里，@angular-eslint/template/alt-text有没有自定义的强制配置项，会不会是额外要求导致告警一直触发。

内容来源于stack exchange