Is there an easy way to cancel Ionic radio in Ionic 2?
After the user selects the ionic radio, a function is called on the component. I need this function to deselect the radio.
TEMPLATE:
<form [formGroup]="myForm">
<ion-list radio-group formControlName="listOptions">
<ion-item>
<ion-label>Option 1</ion-label>
<ion-radio value="1" (ionSelect)="myFunction($event)"></ion-radio>
</ion-item>
</ion-list>
</form>
source to share
Not sure about usecase here, but here we go ...
Since you are using a reactive form, you have some functionality that you can perform in your form controls, one of which is reset()
. So, in your function, you would just reset a value like this:
myFunction() {
this.myForm.controls.listOptions.reset()
}
and it will reset disabled if this is your initial switch state.
Demo that sets a radio button reset after a couple of seconds
source to share
You can use checked
for this. And use boolean to manipulate it. In .html add this
<ion-radio checked={{isChecked}} value="1" (ionSelect)="myFunction($event)"></ion-radio>
In .ts add this:
export class SomePage{
isChecked = false;
constructor(...){...}
myFunction($event){
this.isChecked = !this.isChecked; // I am assuming you want to switch between checking and unchecking while clicking on radio.
}
If there are multiple radio buttons, you can use an array of flags, eg isChecked[]
.
source to share