如何在Angular中循环单选按钮集

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

@Component({
  selector: 'app-radio-button',
  template: `
    <div *ngFor="let option of options">
      <input type="radio" [id]="option.id" [value]="option.value" [(ngModel)]="selectedOption" (ngModelChange)="handleSelectionChange()">
      <label [for]="option.id">{{ option.label }}</label>
    </div>
    <p>选中的值: {{ selectedOption }}</p>
  `,
})
export class RadioButtonComponent {
  options = [
    { id: 'option1', value: 'option1', label: '选项1' },
    { id: 'option2', value: 'option2', label: '选项2' },
    { id: 'option3', value: 'option3', label: '选项3' },
  ];
  selectedOption: string;

  handleSelectionChange() {
    // 处理选中值的逻辑
    console.log(this.selectedOption);
  }
}

<app-radio-button></app-radio-button>