angular reactive form无法删除null项

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

@Component({
  selector: 'app-example',
  template: `
    <form [formGroup]="formGroup">
      <input formControlName="item1" placeholder="Item 1">
      <input formControlName="item2" placeholder="Item 2">
    </form>
    <button (click)="removeNullItem()">Remove Null Item</button>
  `,
})
export class ExampleComponent implements OnInit {
  formGroup: FormGroup;

  ngOnInit() {
    this.formGroup = new FormGroup({
      item1: new FormControl('value 1'),
      item2: new FormControl(null),
    });
  }

  removeNullItem() {
    const item2Control = this.formGroup.get('item2');
    if (item2Control && item2Control.value === null) {
      this.formGroup.removeControl('item2');
    }
  }
}