/
githubmirror
/
components
Обзор
Документация
Войти
/
githubmirror
/
components
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
src/components-examples/material/stepper/stepper-optional/stepper-optional-example.html
42 строки
1 KB
Michael Small
docs: convert Stepper/Tabs/Timepicker example to signals (#33536)
21 июл 2026, 10:25
Не верифицирован
21 июл 2026, 10:25
43a87a4
Код
Авторство
О чём код?
<button matButton="elevated" (click)="isOptional.set(!isOptional())"> {{!isOptional() ? 'Enable optional steps' : 'Disable optional steps'}} </button> <mat-stepper linear #stepper> <mat-step [stepControl]="firstFormGroup"> <form [formGroup]="firstFormGroup"> <ng-template matStepLabel>Fill out your name</ng-template> <mat-form-field> <mat-label>Name</mat-label> <input matInput placeholder="Last name, First name" formControlName="firstCtrl" required> </mat-form-field> <div> <button matButton matStepperNext>Next</button> </div> </form> </mat-step> <!-- #docregion optional --> <mat-step [stepControl]="secondFormGroup" [optional]="isOptional()"> <!-- #enddocregion optional --> <form [formGroup]="secondFormGroup"> <ng-template matStepLabel>Fill out your address</ng-template> <mat-form-field> <mat-label>Address</mat-label> <input matInput formControlName="secondCtrl" placeholder="Ex. 1 Main St, New York, NY" required> </mat-form-field> <div> <button matButton matStepperPrevious>Back</button> <button matButton matStepperNext>Next</button> </div> </form> </mat-step> <mat-step> <ng-template matStepLabel>Done</ng-template> <p>You are now done.</p> <div> <button matButton matStepperPrevious>Back</button> <button matButton (click)="stepper.reset()">Reset</button> </div> </mat-step> </mat-stepper>