从Angular 2+中的预定义数据填充formControlName复选框

从Angular 2+中的预定义数据填充formControlName复选框，可以通过以下步骤实现：

1. 创建一个包含预定义数据的数组，例如：

predefinedOptions = [
  { id: 1, name: 'Option 1' },
  { id: 2, name: 'Option 2' },
  { id: 3, name: 'Option 3' }
];

1. 在组件中定义一个FormControl，用于处理复选框的值，例如：

import { FormBuilder, FormControl, FormGroup } from '@angular/forms';

form: FormGroup;

constructor(private formBuilder: FormBuilder) {
  this.form = this.formBuilder.group({
    checkbox: new FormControl()
  });
}

1. 在HTML模板中，使用ngFor指令来遍历预定义数据，并使用formControlName指令来绑定FormControl，例如：

<form [formGroup]="form">
  <div *ngFor="let option of predefinedOptions">
    <label>
      <input type="checkbox" [value]="option.id" formControlName="checkbox">
      {{ option.name }}
    </label>
  </div>
</form>

1. 可选：如果要将预定义的数据填充到FormControl中，可以使用patchValue方法，例如：

this.form.patchValue({
  checkbox: [1, 3] // 填充选中的复选框值
});

这样，当组件初始化时，复选框将根据FormControl的值进行预选。

在腾讯云的解决方案中，可以使用腾讯云的Serverless云函数（SCF）来处理前端与后端的数据交互，使用腾讯云数据库（TencentDB）来存储数据，使用腾讯云CDN加速静态资源的分发等等。具体可以参考以下腾讯云产品：

1. Serverless云函数（SCF）：提供基于事件驱动的无服务器云函数服务，可用于处理前端与后端的数据交互。了解更多信息，请访问：https://cloud.tencent.com/product/scf
2. 腾讯云数据库（TencentDB）：提供可扩展的云数据库服务，包括关系型数据库、文档型数据库、缓存数据库等，可以用来存储应用程序的数据。了解更多信息，请访问：https://cloud.tencent.com/product/cdb
3. 腾讯云CDN：为静态资源提供全球加速和分发服务，可以加快前端页面的加载速度。了解更多信息，请访问：https://cloud.tencent.com/product/cdn

以上是一个完善且全面的答案，涵盖了Angular 2+中预定义数据填充formControlName复选框的实现方法，并推荐了腾讯云相关产品用于构建云计算解决方案。