How can I remove the numbers from the Angular material stepper?
I do not wish to replace them with an icon, I wish to have an empty circle.
Edit : I am using angular 9
Gustavo Damazio :
Inside the mat-step, insert these templates, thus replacing the number that is the default.\n<mat-horizontal-stepper [linear]="true" #stepper>\n <!-- STEPS -->\n <mat-step label="First Step" state="your-state-name-here-1">\n <div>\n <button mat-button matStepperNext>next</button>\n </div>\n </mat-step>\n <mat-step label="Second Step" state="your-state-name-here-2">\n <div>\n <button mat-button matStepperNext>next</button>\n </div>\n </mat-step>\n <mat-step label="Third Step" state="your-state-name-here-3">\n <div>\n <button mat-button matStepperNext>next</button>\n </div>\n </mat-step>\n <!-- STEPS -->\n\n <!-- Replace icon mat-step -->\n <ng-template matStepperIcon="your-state-name-here-1">\n <mat-icon>your-icon-name-or-blank</mat-icon>\n </ng-template>\n <ng-template matStepperIcon="your-state-name-here-2">\n <mat-icon>your-icon-name-or-blank</mat-icon>\n </ng-template>\n <ng-template matStepperIcon="your-state-name-here-3">\n <mat-icon>your-icon-name-or-blank</mat-icon>\n </ng-template>\n <!-- Replace icon mat-step -->\n</mat-horizontal-stepper>\n\nObs:\nIn order to use the custom step states, you must add the displayDefaultIndicatorType option to the global default stepper options which can be specified by providing a value for STEPPER_GLOBAL_OPTIONS in your application's root module or specific child module.\n@NgModule({\n providers: [\n {\n provide: STEPPER_GLOBAL_OPTIONS,\n useValue: { displayDefaultIndicatorType: false }\n }\n ]\n})\n\nOfficial documentation",
2020-06-19T00:02:28