Stepper材质:在typescript中使用stepper.reset()

Question

可以在ts文件中使用stepper.reset()吗？我想做一些像这样的事情

    onCheckRef() {
    if (this.refFormGroup.get('reference').invalid) {
      this.stepper.reset();
    } else {
      .....................
    }
  }

在模板中：

<button mat-button (click)="onCheckRef()" matStepperNext>Valider</button>

谢谢

Answer 1

是的，您可以使用ViewChild装饰器访问组件内部的MatStepper引用

首先使用散列符号在html中定义模板引用变量

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

然后在组件内部使用ViewChild装饰器访问stepper实例

 @ViewChild('stepper',{read:MatStepper}) stepper:MatStepper;

最后，您可以访问reset方法

onCheckRef() {
    if (this.refFormGroup.get('reference').invalid) {
      this.stepper.reset();
    } else {
      .....................
    }
  }

Working Example