Angular：ControlValueAccessor子表单默认值未同步到父表单问题

问题根源在于：自定义组件内部初始化表单默认值后，没有主动调用ControlValueAccessor接口的onChange方法将初始值同步给父表单。只有当用户修改输入框触发值变更时，组件才会触发onChange，父表单才能获取到值。

解决方案步骤： #

• 在组件内部表单初始化完成后，主动调用onChange方法，将初始表单值传递给父表单
• 确保组件的writeValue方法能正确处理外部传入的初始值（若有）
• 保持表单值变更时的同步逻辑正常运行

修改后的关键代码示例： #

private createFormInstance() {
  this.form = this.fb.group({
    username: ['test', [Validators.required]],
    password: ['test', [Validators.required]],
  });
  // 初始化后主动同步初始值到父表单
  this.onChange(this.form.value);
}

// 处理外部传入值的writeValue方法
writeValue(value: any): void {
  if (value) {
    this.form.patchValue(value);
    this.onChange(this.form.value);
  }
}

ngOnInit(): void {
  this.createFormInstance();
}

补充说明： #

ControlValueAccessor的核心是通过onChange和onTouched与父表单进行通信。自定义组件内部的表单值变更（包括初始化的默认值）必须主动触发onChange，父表单才能感知到值的存在，提交时才能正确获取到这些默认值。

内容的提问来源于stack exchange，提问作者RDK