角材料步進器下一步顯示創建而不是 1

Question

我正在使用步進器，我想禁用下一步，直到所有填充都應填充為止，因此我在 html 文件中將其線性設置為 true

<mat-horizontal-stepper [linear]="true" #stepper>
        <mat-step [stepControl]="firstFormGroup">
          <form [formGroup]="firstFormGroup">

它工作正常，但每當我進入下一步時，“1”在檢查時變為“cre”，我得到了

我沒有用戶在我的代碼中的任何地方創建它來自 mat-icon

Answer 1

您可以在mat-step上設置[completed]="false"並且您將只有數字而不是圖標。

或者用鋼筆圖標替換"create"這個詞，你需要添加谷歌材料字體圖標鏈接：

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

Answer 2

在 mat-h​​orizo​​ntal-stepper 中添加#stepper

<mat-horizontal-stepper [linear]="true" #stepper>
....
</mat-horizontal-stepper>

然后在 .ts 文件中獲取那個步進器

@ViewChild('stepper') stepper: MatHorizontalStepper;

最后，在 afterViewInit 中執行

ngAfterViewInit() {
  this.stepper._getIndicatorType = () => 'number';
}

Answer 3

可能你使用另一個字體系列而不是默認值。 您可以通過修復使用步進器的頁面中字體系列的“材料圖標”來解決此問題。

:host /deep/ .material-icons {
  font-family: 'Material Icons' !important;
}