Unselect Radio Button of Angular Material

0

Hello, I have a problem with Angular. I want my button select of the Material Angle to be unchecked when the next function is called, but I have no idea how to do it, could anyone help me ?. I'll put the codes here below.

Function code

uncheckRadio(){
  alert('Botao desmarcado')
}

Code of my Radio Button:

<div  class="form-group col-md6 form-md-checkboxes">
   <label>Instância</label>
   <mat-radio-group (change)="radioChange($event)" formControlName="status">
   <mat-radio-button color="primary" value="primeira">Primeira Instancia</mat-radio-button>
   <mat-radio-button color="primary" value="segunda">Segunda Instancia</mat-radio-button>
   </mat-radio-group>
</div>
    
asked by anonymous 07.11.2018 / 21:29

1 answer

1

To do this, just put a null in your control.

In the example below I created a button to call the uncheckRadio method

<div  class="form-group col-md6 form-md-checkboxes">
    <label>Instância</label>
    <mat-radio-group (change)="radioChange($event)" formControlName="status">
      <mat-radio-button color="primary" value="primeira">Primeira Instancia</mat-radio-button>
      <mat-radio-button color="primary" value="segunda">Segunda Instancia</mat-radio-button>
    </mat-radio-group>
    <button mat-raised-button class="restore-button" (click)="uncheckRadio()">Restore Defaults</button>
  </div>

In the ts file I get the control in the formGroup and reset the value or section null.

uncheckRadio() {
   this.formGroup.get('status').reset();
   // Ou pode ser feito assim: this.formGroup.get('status').setValue(null);
}
    
08.11.2018 / 00:01