从formArray中删除FormControl

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

@Component({
  selector: 'app-form',
  template: `
    <form [formGroup]="myForm">
      <div formArrayName="formArray">
        <div *ngFor="let control of formArray.controls; let i = index">
          <input [formControlName]="i">
          <button (click)="removeControl(i)">Remove</button>
        </div>
      </div>
    </form>
  `,
})
export class FormComponent {
  myForm: FormGroup;

  constructor(private fb: FormBuilder) {
    this.myForm = this.fb.group({
      formArray: this.fb.array([
        this.fb.control('FormControl 1'),
        this.fb.control('FormControl 2'),
        this.fb.control('FormControl 3'),
      ]),
    });
  }

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

  removeControl(index: number): void {
    this.formArray.removeAt(index);
  }
}