1

I have three mat-step. I need to disable 2nd mat-step with some condition and need to allow me to go to 3rd step without that condition. For example, If I have a form in first-stepper, if that form is valid only, I can go to second stepper, but I can go to third steeper if that form is invalid also.

Kasthuri
  • 11
  • 5

1 Answers1

0

The optional attribute on the <mat-step> should do what you're looking for.

See https://material.angular.io/components/stepper/api for exact details.

If you want it to be conditional it would be something like:

<mat-step [optional]="someCondition">
Jesse
  • 2,391
  • 14
  • 15
  • Thank you. Its not working for me. Form valid (first-stepper validation) should required for second stepper and is optional for third stepper.. Without fill all the mandatory fields, need to allow me to go to third stepper, not allow to go to second-stepper. – Kasthuri May 20 '20 at 04:17
  • Is there any way to put required for particular step and optional for another steps? – Kasthuri May 20 '20 at 04:29
  • I think so. This stackblitz from the Angular Material docs makes it seem possible: https://stackblitz.com/angular/yjpdqjljqxak?file=src%2Fapp%2Fstepper-label-position-bottom-example.ts but your use case might be different. – Jesse May 20 '20 at 04:31
  • Yes. For me, need to put double condition (required and optional according the next steppers' index/name) for same stepper – Kasthuri May 20 '20 at 04:54