角度：Google材质图标无法呈现

Question

在Angular项目中，Google材质图标在chrome中工作正常，但在 chrome隐身模式和 firefox 中无法渲染。 在 index.html 中，以下行用于获取字体库。

  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

在模板中：

<mat-icon>person</mat-icon>

将人显示为文本，而不是图标。 在浏览器的“网络”标签中，它显示 307临时重定向作为两个请求的状态代码。

以下在浏览器中输出：

Answer 1

您必须使用：

<i class="material-icons">3d_rotation</i>
<i class="material-icons">person</i>

Answer 2

用作：

<mat-icon svgIcon="person" aria-hidden="false"></mat-icon>
<mat-icon svgIcon="password" aria-hidden="false"></mat-icon>

参考：https://material.angular.io/components/icon/overview