Радиокнопка отключена при нажатии - PullRequest
0 голосов
/ 05 мая 2020

У меня есть форма с разными ответами. Один из моих элементов управления формой - это переключатель. Когда я нажимаю на один из этих переключателей, включаются все остальные.

 <form [formGroup]="formAnswers">
                      <!-- body risposte -->
                      <div *ngFor="let answer of questions.answers; let n = index;" class="row mb-1 border-bottom">
                        <!-- checkbox -->
                        <div
                          class="col-xs-1 col-sm-1 col-md-1 col-lg-1 text-left form-check form-check-inline pl-1">
                          <input formControlName="idAnswerRadio" class="form-check-input cursor-pointer radio-button"
                            type="radio" (click)="manageAnswer(n)">
                        </div>
                        <div class="col-xs-9 col-sm-9 col-md-9 col-lg-9 text-left risposta-wrap">
                          {{answer.text}}
                        </div>
                        <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1 text-center">
                          {{answer.value}}
                        </div>
                      </div>
 </form>


  createFormAnswer(questions?: Questions[]) {
                                for (let i = 0; i < domande.length; i++) {
                                // other formcontrols questions
                                     for (let n = 0; n < questions[i].answers.length; n++) {
                                        this.formAnswers = this.formBuilder.group({
                                         idAnswerRadio: []
                                })
                              }
                         }
                      }

Приведенный выше код является кодом для создания формы для ответа. К сожалению, я не могу добавить в stackblitz

1 Ответ

0 голосов
/ 05 мая 2020

Можно выполнить привязку к условному свойству disable, чтобы изменить каждую из кнопок radio. Кроме того, вы можете прослушивать изменения на "основном" переключателе, чтобы реагировать на изменение его значения.

ПРИМЕР:

Типовой файл:

private isAnswerRadio: boolean = false;

public formAnswers: FormGroup = new FormGroup({
  'isAnswerRadio': new FormControl(...),
  // Other form controls (Initially disabled)
  '...': new FormControl(...),
  ...
});

ngOnInit() {
  this.formAnswers.get('isAnswerRadio').valueChanges.subscribe(newData => {
      if(newData === ...) { // If equals to the desired selection of the radio button
        this.isAnswersRadio = true;
      }
  });
}

getDisabled(): boolean {
  return this.isAnswerRadio;
}

HTML файл:

<input
    formControlName="idAnswerRadio"
    class="form-check-input cursor-pointer radio-button"
    type="radio"
    (click)="manageAnswer(n)">

<!-- Other inputs... -->

<input [disabled]="getDisabled()">
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...