I am wondering how I can skip a step change in Angular Material Stepper.
Every "solution" I see, are not working. I tried also to set the steps regarding on some conditions to editable=false. But this means, that the step cannot edit if it is touched once by a user. Initialized the step with editable=false can be edited :(
I want to skip the step change if the value is equal "stop".
Stackblitz
import { Component, ViewChild } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
@ViewChild("stepper") stepper;
constructor(private router: Router) {
this.router.navigate(['material']);
}
showMaterialPage() {}
}
For following use case needed:
User see a custom formular with many input fields, checkboxes and so on. If he made changes but did not submit the changes and he is going to click another dialog, then it should be checked if he has changed values. If it is, a confirm dialog pops up. In this dialog the user will be asked if he will discard the changes or not. If he say not, then the current selected step should not leave. This works for me in my application, but the problem is that the animation is done anyway and so it seams optically that the user is at the next step.