Angular Material 按钮移除自动对焦

Question

我有以下按钮

<td mat-cell *matCellDef="let element">
  <button mat-icon-button type="button" (click)="downloadStuff(element)">
    <mat-icon mat-icon matTooltip="{{element.someId}}">picture_as_pdf</mat-icon>
  </button>
</td>

一切都很好，但我注意到这个小虫子默认情况下会被勾勒出来：

好的…. CSS 让我可以通过以下方式删除恼人的轮廓：

 button:focus {
    outline: none;
}

但是然后..我仍然得到这个烦人的默认背景焦点：

我在 CSS 中尝试了一些覆盖和背景相关的东西，但似乎都没有解决这个问题。如何删除此默认背景？为什么默认情况下会这样？？？

查看开发工具中的选定项目。

原文由 tom33pr 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

所以我只是在提交按钮或其他东西上添加 cdkFokusInitial

原文由 AF2828 发布，翻译遵循 CC BY-SA 4.0 许可协议