javascript - What is the function of the stepControl property on mat-step directives? - Stack Overflow

On the Angular Material stepper there is a stepControl property on each mat-step that contains a form. What does the stepControl property do?

<mat-step [stepControl]="registrationForm">

It seems like the function would be to disallow moving to the next step if the form is not valid, but just wanted to double check.

On the Angular Material stepper there is a stepControl property on each mat-step that contains a form. What does the stepControl property do?

<mat-step [stepControl]="registrationForm">

It seems like the function would be to disallow moving to the next step if the form is not valid, but just wanted to double check.

• javascript
• angular
• typescript
• angular-material

Share Improve this question Follow asked Feb 10, 2022 at 14:18 OleOle 47.6k7070 gold badges238238 silver badges447447 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

Correct, however, if any form validation is not pulsory you can use the isOptional property to ignore that form's validity and proceed to the next step.

<mat-step [stepControl]="registrationForm" [optional]="isOptional">

Similarly if you are not using Reactive Forms you can use another property called pleted to allow the user to proceed to the next step only if pleted is true

<mat-step [pleted]="isCompleted">