在使用ControlValueAccessor实现自定义表单控件时，如果我们的组件包含单选按钮，我们需要在相关的input 元素中绑定 [(ngModel)]，否则单选按钮的选中状态将不能被正确地维护。

以下是示例代码：

my-custom-component.component.ts

import { Component, forwardRef } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';

@Component({
  selector: 'app-my-custom-component',
  templateUrl: './my-custom-component.component.html',
  styleUrls: ['./my-custom-component.component.scss'],
  providers: [
    {
      provide: NG_VALUE_ACCESSOR,
      useExisting: forwardRef(() => MyCustomComponentComponent),
      multi: true
    }
  ]
})
export class MyCustomComponentComponent implements ControlValueAccessor {

  selectedValue: string;
  isDisabled: boolean = false;

  onChange: any = () => { };
  onTouch: any = () => { };

  setValue(value: any) {
    this.selectedValue = value;
    this.onChange(value);
    this.onTouch();
  }

  writeValue(value: any) {
    this.selectedValue = value;
  }

  registerOnChange(fn: any) {
    this.onChange = fn;
  }

  registerOnTouched(fn: any) {
    this.onTouch = fn;
  }

  setDisabledState(isDisabled: boolean) {
    this.isDisabled = isDisabled;
  }

}

my-custom-component.component.html

  
    
    {{ option.label }}
  

在这个示例中，我们为MyCustomComponentComponent实现了ControlValueAccessor接口，在该组件中维护了selectedValue和isDisabled属性，并且实现了setValue、writeValue、registerOnChange、registerOnTouched和setDisabledState这些方法。

同时，在my-custom