Question

我正在使用Ionic 2。我有一个广播组（改变语言）：

 <ion-list radio-group >
  <ion-item *ngFor="let language of languages">
    <ion-label>{{language.name}}</ion-label>
    <ion-radio id="language.id" (ionSelect)='showConfirmAlert(language.id)' [checked]="isLanguageSelected(language.id)" [value]="language.name"></ion-radio>
  </ion-item>
</ion-list>

在选择项目（单击单选按钮）时，项目会自动更改并检查。但我需要显示确认提醒，然后，如果用户取消，取消项目选择并返回初始检查项目。

“checked”属性与我的代码绑定

isLanguageSelected(lang){
  let answer = (lang === this.actualLanguage) ? true : false;
  return answer;
}

 chooseLanguage(lang){
     this.actualLanguage = lang;
     this.appGlobals.set('actualLanguage', this.actualLanguage);
}

它首先到达页面，但如果我再次启动，例如选择英语：

this.chooseLanguage('en') ;

如果我记录它，

this.actualLanguage很好地改为“en”，并this.isLanguageSelected('en');返回true，但是en-item的“checked”值没有绑定到它，并且item不会更新。

有没有办法从代码更新项目检查属性，而不仅仅是点击单选按钮？

谢谢！

更新答案：

最后我通过使用[（ngModel）]变量并在我的代码中切换一些元素来解决这个问题（删除ionSelect，更改binded变量的值......）

<ion-list radio-group [(ngModel)]="selectedLanguage" (ionChange)="onChange()" >
  <ion-list-header>
    Choisissez la langue {{actualLanguage.id}} 
  </ion-list-header>
  <ion-item *ngFor="let language of languages">
     <ion-label>{{language.name}}</ion-label>
    <ion-radio  id="language.id" (click)='showConfirmAlert(language.id)'  [value]="language.id"></ion-radio>
  </ion-item>
</ion-list>

Answer 1

在 .ts 页面中：

定义布尔变量：checkedRadio: boolean
将变量绑定到您的组件：<ion-radio [(ngModel)]="checkedRadio"></ion-radio>

现在，您可以设置this.checkedRadio = false或this.checkedRadio = true

我希望能给你一个帮助。：）

从Ionic 2中的代码更改单选按钮“已选中”属性

1 个答案: