在angular 2 reactive forms中动态删除表单控件

在Angular 2 Reactive Forms中动态删除表单控件，可以通过以下步骤实现：

首先，需要在组件中创建一个表单控件数组，用于存储动态添加的表单控件。例如，可以使用FormArray来实现：

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl, FormArray } from '@angular/forms';

@Component({
  selector: 'app-my-form',
  templateUrl: './my-form.component.html',
  styleUrls: ['./my-form.component.css']
})
export class MyFormComponent implements OnInit {
  myForm: FormGroup;

  constructor() { }

  ngOnInit() {
    this.myForm = new FormGroup({
      formControls: new FormArray([])
    });
  }

  get formControls() {
    return this.myForm.get('formControls') as FormArray;
  }

  addFormControl() {
    this.formControls.push(new FormControl());
  }

  removeFormControl(index: number) {
    this.formControls.removeAt(index);
  }
}

在模板中，可以使用ngFor指令来循环显示表单控件，并为每个控件提供删除按钮。当点击删除按钮时，调用组件中的removeFormControl方法来删除对应的表单控件。

<form [formGroup]="myForm">
  <div formArrayName="formControls">
    <div *ngFor="let control of formControls.controls; let i = index">
      <input [formControlName]="i">
      <button (click)="removeFormControl(i)">删除</button>
    </div>
  </div>
</form>
<button (click)="addFormControl()">添加表单控件</button>

通过以上步骤，就可以在Angular 2 Reactive Forms中实现动态删除表单控件的功能。每次点击"添加表单控件"按钮，都会在表单中动态添加一个新的表单控件，并且为每个控件提供删除按钮。当点击删除按钮时，对应的表单控件会被从表单中删除。这种方式可以灵活地管理表单控件的数量和内容。

推荐的腾讯云相关产品：腾讯云云服务器（CVM），腾讯云对象存储（COS），腾讯云数据库MySQL版（TencentDB for MySQL），腾讯云人工智能（AI）服务等。你可以通过访问腾讯云官方网站（https://cloud.tencent.com/）了解更多关于这些产品的详细信息和使用指南。