mat-radio-buttonの(click)は危険

Angular MaterialのRadio buttonを使うとき、通常の<button>要素と同じ感覚で(click)イベントをバインディングする際は注意が必要です。

このGIFのように、ラジオボタン部分のクリックできるギリギリの箇所をクリックすると、ラジオボタンの状態は変わりますが、(click)イベントが発火しません。（2025/5/10時点での最新バージョンv19.2.0で確認済み）

状態の変化を検知したい場合は(change)イベントをバインディングするか、mat-radio-groupと合わせてテンプレート駆動フォームやリアクティブフォームを使いましょう。

<!-- NG -->
<mat-radio-button (click)="click()">Option 1</mat-radio-button>

<!-- OK -->
<mat-radio-button (change)="change()">Option 1</mat-radio-button>

<!-- OK -->
<mat-radio-group [(ngModel)]="selectedOption">
  <mat-radio-button value="A">Option A</mat-radio-button>
  <mat-radio-button value="B">Option B</mat-radio-button>
</mat-radio-group>

一応、サンプルを置いておきます。