angular - 单击角度按钮时，步进器的 SelectedIndex 未更新

Question

当我单击指定的更新状态按钮时，步进器不会更新到提供的索引。

.html 文件：

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<h2>Connection Status</h2>
<button class="btn btn-primary waves-light" mdbWavesEffect (click)=openDialog()>Update Status</button>
<p>
   <mat-horizontal-stepper linear #stepper>
      <mat-step label="Connection Request Sent"></mat-step>
      <mat-step label="Connection Response Received"></mat-step>
      <mat-step label="Connection Established"></mat-step>
      <mat-step label="Done"></mat-step>
   </mat-horizontal-stepper>
</p>

ts文件：

import { Component, OnInit, ViewChild } from "@angular/core";
import { MatHorizontalStepper } from "@angular/material/stepper";

@Component({
selector: "app-stepper-test",
templateUrl: "./stepper-test.component.html",
styleUrls: ["./stepper-test.component.scss"]
})
 export class StepperTestComponent implements OnInit {@
    ViewChild(MatHorizontalStepper, {
        static: false
    })
    stepper: MatHorizontalStepper;
    constructor() {}
    ngOnInit() {}
    openDialog() {
        this.stepper.selectedIndex = 2;
    }
}

标签： angularangular-material