#angular #angular-reactive-forms #angular-forms
#angular #angular-реактивные формы #angular-формы
Вопрос:
У меня есть динамический переключатель с таким кодом
<form #quizRes="ngForm" (submit)="submit()">
<nb-stepper #stepper disableStepNavigation>
<nb-step *ngFor="let question of quizDetail?.questions;let i=index">
<p style="font-size: 20px;text-align: center;"><b>{{question.name}}</b></p>
<nb-radio-group *ngFor="let option of question.options;" required>
<nb-radio class="answerRadio" style="margin: auto;width: 500px;max-width: 100%;"
status="control" id="{{option.order}}" name="jawaban" ngDefaultControl
[ngModelOptions]="{standalone: true}" [(ngModel)]="question.options.code"
value="{{option.code}}" name="{{question.order}}" #jawaban="ngModel"
[status]="jawaban.invalid ? 'danger' : 'basic'" >
{{option.name}}
</nb-radio>
</nb-radio-group>
<button style="margin-top: 30px;margin-right:10px;" *ngIf="i > 0" nbButton
nbStepperPrevious>Back</button>
<button style="margin-top: 30px;" *ngIf="i < quizDetail?.questions.length-1" nbButton
nbStepperNext>Next</button>
<button style="margin-top: 30px;" *ngIf="i == quizDetail?.questions.length-1" nbButton
nbStepperNext type="submit">Submit</button>
</nb-step>
<nb-step hidden="true" *ngIf="quizLoading == false">
<div class="step-container" style="text-align: center;">
<h3>Quiz Selesai, silahkan lanjut ke materi selanjutnya!</h3>
</div>
</nb-step>
</nb-stepper>
</form>
Я хочу запретить пользователю пропускать вопросы, отключив кнопку далее, как я могу этого добиться?
Комментарии:
1. вы можете проверить правильность каждого шага в mat-stepper, взгляните на этот пример stackblitz.com/angular/xamgqqmegavq?file=src/app /…
2. да, я думаю, мне нужно добавить шаговое управление