一些 Material 图标未在我的 Angular 项目中渲染

Question

在我的 Angular 项目中，一些 Material 图标似乎没有渲染：

<mat-icon>domino_mask</mat-icon>
<mat-icon>hourglass</mat-icon>

其他图标正常渲染。我已尝试以下步骤来解决该问题：

1. 清理了node_modules目录并重新运行npm install。
2. 使用 ng update 更新了 Angular Material
3. 已验证 MatIconModule 已导入到我的模块中。
4. 检查我的index.html 中是否存在材质图标的标签：

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

尽管做出了这些努力，问题仍然存在。任何有关可能出现问题或我可以尝试的其他步骤的建议将不胜感激。

谢谢！

Answer 1

domino_mask 和 hourglass 图标均来自 Material Symbols Outlined 样式表。

在此答案中，您需要：

1. 在 index.html 中导入 Material Symbols Outlined 样式表。

<link
  rel="stylesheet"
  href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined"
/>

2. 为两个

   fontSet

   元素指定

   <mat-icon>

   属性。

<mat-icon fontSet="material-symbols-outlined">domino_mask</mat-icon>
<mat-icon fontSet="material-symbols-outlined">hourglass</mat-icon>

演示@StackBlitz