您可以将所选索引的Math.max和原始索引0，请在下面找到一个工作示例进行验证！
ts

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { MAT_STEPPER_GLOBAL_OPTIONS } from '@angular/cdk/stepper';
import { ViewChild } from '@angular/core';

/**
 * @title Stepper that displays errors in the steps
 */
@Component({
  selector: 'stepper-errors-example',
  templateUrl: 'stepper-errors-example.html',
  styleUrls: ['stepper-errors-example.css'],
  providers: [
    {
      provide: MAT_STEPPER_GLOBAL_OPTIONS,
      useValue: { showError: true },
    },
  ],
})
export class StepperErrorsExample implements OnInit {
  firstFormGroup: FormGroup;
  secondFormGroup: FormGroup;
  selectedIndex = 0;

  constructor(private _formBuilder: FormBuilder) {}

  ngOnInit() {
    this.firstFormGroup = this._formBuilder.group({
      firstCtrl: ['', Validators.required],
    });
    this.secondFormGroup = this._formBuilder.group({
      secondCtrl: ['', Validators.required],
    });
  }

  selectedIndexChange(event: any) {
    if (
      event &&
      event.previouslySelectedStep &&
      !event.previouslySelectedStep.errorMessage
    ) {
      this.selectedIndex = Math.max(this.selectedIndex, event.selectedIndex);
    } else {
      this.selectedIndex = event.selectedIndex;
    }
  }
}

字符串
HTML

<mat-horizontal-stepper
  linear
  #stepper
  (selectionChange)="selectedIndexChange($event)"
  ngClass="{{ 'last-edited-step-' + selectedIndex }}"
  labelPosition="bottom"
>
  <mat-step [stepControl]="firstFormGroup" errorMessage="Name is required.">
    <form [formGroup]="firstFormGroup">
      <ng-template matStepLabel>A1</ng-template>
      <mat-form-field>
        <input
          matInput
          placeholder="Last name, First name"
          formControlName="firstCtrl"
          required
        />
      </mat-form-field>
      <div>
        <button mat-button matStepperNext>Next</button>
      </div>
      <mat-form-field appearance="outline">
        <mat-label>Outline form field</mat-label>
        <input matInput placeholder="Placeholder" />
        <mat-hint>Hint</mat-hint>
      </mat-form-field>
    </form>
  </mat-step>
  <mat-step [stepControl]="secondFormGroup" errorMessage="Address is required.">
    <form [formGroup]="secondFormGroup">
      <ng-template matStepLabel>A2</ng-template>
      <mat-form-field>
        <input
          matInput
          placeholder="Address"
          formControlName="secondCtrl"
          required
        />
      </mat-form-field>
      <div>
        <button mat-button matStepperPrevious>Back</button>
        <button mat-button matStepperNext>Next</button>
      </div>
    </form>
  </mat-step>
  <mat-step>
    <ng-template matStepLabel>A3</ng-template>
    You are now done.
    <div>
      <button mat-button matStepperPrevious>Back</button>
      <button mat-button (click)="stepper.reset()">Reset</button>
    </div>
  </mat-step>
</mat-horizontal-stepper>

型
stackblitz