如何添加材质图标

我正在尝试在我的应用中使用轮廓材料图标。我似乎无法正确导入它们。我只能使用标称填充的图标。我希望能够使用this example之类的轮廓图标。

在示例中,我可以使用done_outline图标。他们如何导入所有图标?

在我的应用中,我安装了npm install material-design-icons

并且我已经将MatIconmodule导入了app.module.ts,但是我仍然不能使用任何轮廓图标。

SODOU619157158 回答:如何添加材质图标

您有两种解决方法。

1)第一个解决方案。

  1. 索引文件中的链接字体元素
<link href="https://fonts.googleapis.com/icon?family=Material+Icons"
      rel="stylesheet">

或大纲版本:

<link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined"
  rel="stylesheet">
  1. 您可以在模板中使用它
<i class="material-icons">face</i>

2)带有材料包装的解决方案

  1. 您必须安装材料包

npm install @ angular / material

  1. 引用到app.module
import {MatIconModule} from '@angular/material/icon';
  1. 立即使用
<mat-icon>face</mat-icon>

演示:

https://stackblitz.com/edit/angular-psj1hy

本文链接:https://www.f2er.com/2387217.html

大家都在问