Question

我正在使用材料图标，我喜欢，BTW。所以，我在这里查看了连字：https://material.io/icons/并且一直在使用它们。

但我有一个屏幕，其中两个图标没有出现，我无法弄明白。这是我的HTML：

<hello name="{{ name }}"></hello>
<p>
        <button mat-icon-button (click)="onUpClick()">
          <i class="material-icons">arrow upward</i>
        </button>
        <br/>
        <br/>
        <button mat-icon-button (click)="onDownClick()">
          <i class="material-icons">arrow downward</i>
        </button>
        <br/>
        <br/>
        <button mat-icon-button (click)="onClearClick()">
          <i class="material-icons">clear</i>
        </button>
        <br/>
        <br/>
        <button mat-icon-button (click)="onDeleteClick()">
          <i class="material-icons">delete</i>
        </button>
</p>

清除并删除显示，但向上和向下箭头不会显示。这是stackblitz：https://stackblitz.com/edit/angular-hntkry?file=app%2Fapp.component.html

我已经用Google搜索了，但无法找到某些图标显示的问题，而不是其他图标。

Answer 1

Arrow_upward和arrow_downward拼写为_，而不是空格。

Answer 2

您是否已链接Material + Icons字体系列？如果不是，请执行

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

以及@MateuszJuruś是对的，应该_而不是space。

Answer 3

不应该是<i class="material-icons">keyboard_arrow_down</i>而不是<i class="material-icons">arrow downward</i>

缺少向上箭头和向下箭头材料图标

3 个答案: