Question

我必须根据来自支持的回复来检查我的无线电组。 html代码下面的位于我的旁边菜单

这是我的代码：

 <ion-list radio-group [(ngModel)]="selectedLanguage"  class="list-space">

            <ion-item *ngFor="let language of languageArray; let val = index" class="radio" > 
              <ion-label menuClose>{{language.local}}</ion-label>
              <ion-radio item-left checked={{languageChoosen}} [value]="language" menuClose  (click)="doSomething(language)"></ion-radio> 
            </ion-item>

          </ion-list>

正如您所看到的，我已经将checked={{languageChoosen}}作为.ts文件中的变量。

如果用户更改了任何内容，我可以在我的应用程序第一次打开时显示所选的电台选项，之后我无法显示所选的电台选项。

更新

doSomething(event){ 
    console.log("invoking dosomething fun");
    console.log("checking event params "+event);

    let languageObj

    if(event){
      languageObj = {
        lang_id: event.lang_id
      }

      console.log("cheking languageObj " + JSON.stringify(languageObj));
      // this.holders.presentLoadingCustom();

      this.rest.post('/language',languageObj)
      .subscribe((result)=>{;
        // this.holders.dissmissLoadingCustom()
        console.log("checking data of success " +JSON.stringify(result));
        if(result.status == '1'){
          this.logger.debug("checking "+this.selectedLanguage);
          this.selectedLanguage = '';
          this.toggleLanguages();
          for(var i = 0; i < this.languageArray.length; i++){
            if(languageObj.lang_id == this.languageArray[i].lang_id){
              this.languageChoosen = this.languageArray[i].local;
            }
          }
          this.checkLanguageReq();
        }
        else{
          console.log("error");
        }
      });

    }
    else{
      console.log("error of languages automatic call");
    }

  }

Answer 1

您无需使用checked属性（checked={{languageChoosen}}），因为将使用[(ngModel)]="selectedLanguage"选择无线电选项。因此，您唯一需要做的就是使用语言 object 初始化selectedLanguage属性（因为每个无线电项的值是一个对象：[value]="language"）。 / p>

另请注意，您可以避免在html代码中使用menuClose属性，并在选择选项时使用ts代码中的this.menuCtrl.close();方法：

constructor(private menuCtrl: MenuController) {
    // ...
}

public doSomething(language: any): void {
    // First close the menu
    this.menuCtrl.close();

    //...
}

Answer 2

你可以这样做你的HTML中有这样的

<input #ansa (click)="updateAnwer(ansa.value)" value="A" type="radio" id="quesA" name="ques">
<input #ansb (click)="updateAnwer(ansb.value)" value="B" type="radio" id="quesB" name="ques">

在上面的代码中，每当用户更改内容时，我都会分配一个id来输入，然后我调用一个函数并找到所选的输入ID并将true应用于checked属性，如下所示，它对我来说工作正常

uncheckedR(value){                                                 
   if(value == 'A'){
      (<HTMLInputElement>document.getElementById('quesA')).checked = true;
    }else if(value == 'B'){
      (<HTMLInputElement>document.getElementById('quesB')).checked = true;
    }else{
      (<HTMLInputElement>document.getElementById('quesA')).checked = false;
      (<HTMLInputElement>document.getElementById('quesB')).checked = false;
   }
}

将此功能调用到您想要检查无线电的位置

Answer 3

对我来说很好......

function checkedRdButton(value)
{
   if(value=="A")
    {
      $("#rdtab0").prop('checked', true);
    }
   else
   {
      $("#rdtab1").prop('checked', true);
   }
}

如何显示选中的单选按钮

3 个答案: