Use this tag for questions about Angular Material Stepper, the implementation of stepped workflow with Material Design styling.
Questions tagged [angular-material-stepper]
123 questions
0
votes
2 answers
How to reset a 'Material Angular Stepper' Step?
I have a Material Angular Stepper (here a stackblitz running example) and I would like to reset the form on each step when the step is loaded.
I found in the Material Angular docs
that we can use reset() method on MatStep to
Resets the step to its…
script0
- 387
- 2
- 12
0
votes
2 answers
How to dynamically change the steps of a material stepper when pressing a checkbox
I am developing a modal window (Angular 7 + Material Angular solution)that pressing a checkbox has to change the steps of the stepper, from the 5 that are original to only 3, with this it implies that the last step is only a confirmation of the…
Felipe Parra Soto
- 27
- 4
0
votes
1 answer
Angular Material Stepper: show only current and next step in stepper-header
I am using the Angular Material Stepper(v13.x.x) in horizontal orientation and linear mode.
By default the stepper-header shows all the steps available. However I would like it to only show the active step, the step before and the step after. (And…
MrrrLuiigii
- 41
- 2
- 10
0
votes
1 answer
Angular 7 @ViewChild error Cannot read properties of undefined (reading 'next')
I have two components that I want them to interact with eachother.
First is a modal that has a button in it that upon being clicked I want to go to the next step of my app. The second component is an angular material stepper. How can I make my app…
weinde
- 1,074
- 3
- 13
- 32
0
votes
1 answer
Dynamically create a mat-step outside of mat-horizontal-stepper
I am trying to create a dynamic stepper form in angular material. I have defined my main components as such
my-stepper.component.ts
in another…
DTul
- 646
- 6
- 21
0
votes
1 answer
How to change color in Stepper according to active and completed Step
Reactjs,MaterialUI
I am using reactjs and material ui in my project and i want to change color of StepConnector and Button inside Step if it is active or completed.i want to change color of StepConnector and Button if next step is Active.Below is…
Tanmay Mandaogane
- 5
- 1
- 4
0
votes
1 answer
Angular Stepper in different Components , Reactive Forms Problem
I used this example to separate each step of the stepper in different components:
https://stackblitz.com/edit/angular-material-stepper-with-component-steps?file=app%2Fstep-one%2Fstep-one.component.html
The problem is, that after filling each input…
maya
- 1
0
votes
1 answer
Angular Material - How to display matTooltip for angular stepper when the steps are disabled
I have an Angular horizontal stepper, that is disabled in the css and I want to display the tooltip.
This is not going to work because of the disabled css code.
// .ts file:
Saad Hasan
- 458
- 5
- 17
0
votes
1 answer
Angular - Material Stepper Skips one step on Next Step Click
In Angular-12 I am implementing Material Stepper:
@ViewChild('stepper') stepper!: MatHorizontalStepper;
isLinear = true;
districtInfoForm!: FormGroup;
zonalInfoForm!: FormGroup;
groupInfoForm!: FormGroup;
regionInfoForm!:…
user11352561
- 2,277
- 12
- 51
- 102
0
votes
2 answers
Angular Material stepper not proceeding to next step when being called from nested component. (Angular 11)
When calling
this.stepper.next()
using a button on the child component, the stepper is not progressed until the second time the button is clicked.
Parent Component Html
Test
…
BondAddict
- 599
- 5
- 12
0
votes
0 answers
Angular Material Stepper icons not displaying as should - bubble, line & current stage
I'm having an issue implementing an Angular Material Stepper in my app. The general functionality seems to work fine, validation, not letting the user progress until all fields are completed and general look of the form.
However the stepper text,…
Robgit28
- 268
- 4
- 18
0
votes
2 answers
Angular material stepper index
am having a problem on changing a class once i click on the step of a mat-stepper.
Does anybody knows how to give a dynamic class once the stepper change index for example ?
Nicola R.
- 1
- 2
0
votes
1 answer
Why Angular Material mat-horizontal-stepper and mat-stepper, on following step, first (click) does not work?
I have a weard problem with my (click) event, where second click is triggered in Angular code:
bakunet
- 559
- 8
- 25
0
votes
1 answer
How to get formControlName value forms in Stepper in Angular 11 material?
I use angular material 11 and i use the stepper material component https://material.angular.io/components/stepper/examples.
I want to get the selected value in the first step and i want to display to user the message with his selected value in first…
obela06
- 307
- 5
- 15