如何重置角度打字稿中的mat-button-toggle-group？

Question

在mat-button-toggle-group中单击角后如何重置onSubmit？

Answer 1

您可以将[(ngModel)]="selected"用于<mat-button-toggle-group>，并且要重置它时，只需将变量设置为 undefined

HTML代码：

<mat-button-toggle-group name="fontStyle" aria-label="Font Style" [(ngModel)]="selected">
  <mat-button-toggle value="bold">Bold</mat-button-toggle>
  <mat-button-toggle value="italic">Italic</mat-button-toggle>
  <mat-button-toggle value="underline">Underline</mat-button-toggle>
</mat-button-toggle-group>
<br>
<button mat-stroked-button color="primary" (click)="reset()">Reset</button>

TS代码：

import {Component} from '@angular/core';

@Component({
  selector: 'button-toggle-overview-example',
  templateUrl: 'button-toggle-overview-example.html',
  styleUrls: ['button-toggle-overview-example.css'],
})
export class ButtonToggleOverviewExample {
  selected : any =  'underline';

  reset(){
    this.selected = undefined;
  }
}

Working StackBlitz