Как я могу всегда отображать значения шага вместе с пользовательским текстом, описывающим значения шага в угловом материале?

Question

Как я могу всегда отображать значения шага вместе с пользовательским текстом, описывающим значения шага в угловом материале?Я хочу, чтобы число вверху и текст внизу.

Answer 1

mat-horizontal-stepper имеет свойство размещать текст / метку внизу.Вы можете использовать метку для описания значения шага.Значение шага отображается сверху, а метка внизу.

Все, что вам нужно, это добавить `labelPosition =" bottom ":

<mat-horizontal-stepper labelPosition="bottom" #stepper>
  <mat-step>
    ...
    <div>
      <button mat-button matStepperPrevious>Back</button>
      <button mat-button matStepperNext>Next</button>
    </div>
  </mat-step>
</mat-horizontal-stepper>

Подробнее здесь: https://material.angular.io/components/stepper/overview

Вот пример для Angular Material:

Положение этикетки - Угловой материал Stepper