<mat-vertical-stepper>
<mat-step label="Agreement Preparation">
<p>Agreement preparion is intiated by our side </p>
</mat-step>
<mat-step label="Ready for Biometric" selected active>
<p>Agreement preparion is intiated by our side </p>
</mat-step>
<mat-step label="Document in Submission">
<p>Agreement preparion is intiated by our side </p>
</mat-step>
i tried setting active and selected but it does not work.
Add a reference to your stepper e.g. #stepper
and after the view initializes, set the selectedIndex
of stepper
to 1.
In your Template:
<mat-vertical-stepper #stepper>
<mat-step label="Agreement Preparation">
<p>Agreement preparion is intiated by our side </p>
</mat-step>
<mat-step label="Ready for Biometric">
<p>Agreement preparion is intiated by our side </p>
</mat-step>
<mat-step label="Document in Submission">
<p>Agreement preparion is intiated by our side </p>
</mat-step>
</mat-vertical-stepper>
... and in your Typescript:
import { ViewChild, AfterViewInit } from '@angular/core';
import { MatStepper } from '@angular/material';
Component({
.....
})
export class ComponentClass implements AfterViewInit {
@ViewChild('stepper') stepper: MatStepper;
ngAfterViewInit() {
this.stepper.selectedIndex = 1;
}
}
Link to StackBlitz demo.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments