Angular Material 2+的默认图标列表

Question

我需要查看Angular Material的默认图标列表 https://material.angular.io/components/icon/overview

我没有使用Font Awesome和Google Fonts

Answer 1

Angular Material Icon组件实际上并没有预先加载Google Material Design图标，我很害怕。

根据Icon overview的文档：

  

默认情况下，<mat-icon> 期望 Material icons font。 （您仍然需要包含HTML来加载字体及其CSS，如链接中所述）。

_{它位于＆＃34;字体图标下，带有连字符＆＃34;头。我也强调＆＃34;希望＆＃34; 这里}

它甚至在Getting Started guide下声明你应该将材料图标字体添加到index.html：

  

如果您想将mat-icon组件与官方Material Design Icons一起使用，请在index.html中加载图标字体。

因此，您必须在您的应用中加载图标字体（或SVG图标集）。你必须自己做。

您可以使用以下字体图标/ SVG图标：

• 字体图标
  • Google's Material Icons以及Material.io
  上的列表
  • Fontawesome (list of icons included in website)
• SVG图标
  • Templarian's Material Design Icons (list of icons included in website)

Answer 2

如果您要使用Lars answer。以下代码将在您的角度项目中设置图标

<span class="material-icons">home</span>