Радиокнопка отключается и включается в зависимости от значения угла 6 - PullRequest
0 голосов
/ 21 марта 2019

Я пытаюсь отключить и включить переключатель в зависимости от значений.В моем коде, если я вписываю «да» в текстовое поле, то нажимаем кнопку «ОК», кнопка-переключатель 1 отключена.Но если я наберу не радио, кнопка 2 не отключается.Я не знаю, что происходит.Кто-нибудь может найти ошибку в моем коде?

https://stackblitz.com/edit/radio-button-gdpwvc?file=src%2Fapp%2Fapp.component.html

clickit(){

if(  this.entervalues=="yes" )  {
this.radio1=true;
}

 if(  this.entervalues=="no" )  {
this.radio2=true;
}

}

Ответы [ 3 ]

2 голосов
/ 21 марта 2019

Вам нужно иметь только 1 переменную для сохранения значения переключателя

Попробуйте это в html,

    <div class="form-check-inline">
       <label class="form-check-label">
       <input type="radio" class="form-check-input" name="radio" [(ngModel)]="radio1" [disabled]="disabled" [value]="true">Yes
       </label>
     </div>
     <div class="form-check-inline">
       <label class="form-check-label">
       <input type="radio" class="form-check-input" name="radio"  [(ngModel)]="radio1" [disabled]="!disabled" [value]="false">No  
       </label>
     </div>

и это в component.ts,

clickit(){
  if(  this.entervalues=="yes" )  {
   this.disabled=true;
  }

  if(  this.entervalues=="no" )  {
    this.disabled=false;
  }
}
0 голосов
/ 21 марта 2019

Я проверил твой код.Основная проблема заключается в том, что вы устанавливаете radio2 значение в true в .ts, но атрибут html связан с false.Таким образом, radio2 будет выбрано, если значение модальной привязки к нему равно false.

ссылка для измененного кода (изменено radio2 на false при нажатии, если в текстовом поле нет значения)

0 голосов
/ 21 марта 2019

Вам не нужны 2 переменные:

  radio;
  entervalues;


  clickit(){
    this.radio = this.entervalues === "yes";
  }

И в шаблоне:

<label class="form-check-label">
     <input type="radio" class="form-check-input" name="radio"  [(ngModel)]="radio" [value]="true">Yes
</label> 
 ...
<label class="form-check-label">
     <input type="radio" class="form-check-input" name="radio"  [(ngModel)]="radio" [value]="false">No
</label>
...