angular reactive forms在保存后删除formArray元素

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

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

  constructor(private formBuilder: FormBuilder) { }

  ngOnInit() {
    this.form = this.formBuilder.group({
      formArrayName: this.formBuilder.array([
        this.createItem()
      ])
    });
  }

  createItem(): FormGroup {
    return this.formBuilder.group({
      name: '',
      age: ''
    });
  }

  addItem(): void {
    const formArray = this.form.get('formArrayName') as FormArray;
    formArray.push(this.createItem());
  }

  removeItem(index: number): void {
    const formArray = this.form.get('formArrayName') as FormArray;
    formArray.removeAt(index);
  }

  saveForm(): void {
    // 保存表单数据的逻辑
    console.log(this.form.value);
  }
}