从 formArray 中删除 FormControl

Question

我创建了我的 FormGroup 如下

this.GSTNForm = this.formbuilder.group({
      gstRegistrationStatusId: new FormControl(''),
      reasonForNonApplicabilityofGST: new FormControl(''),
      isExemptGoods: new FormControl(false),
      goodServiceRemarks: new FormControl(''),
      gstandbankDetails: this.formbuilder.array([
        this.formbuilder.group({
          _id: new FormControl(''),
          sequenceNo: new FormControl(this.gstnSequenceValue),
          gstn: new FormControl(''),
          addressline1: new FormControl(''),
          addressLine2: new FormControl(''),
          stateCode: new FormControl(''),
          cityCode: new FormControl(''),
          countryCode: new FormControl(''),
          pinCode: new FormControl(''),
          accountHolderName: new FormControl(''),
          accountTypeId: new FormControl(''),
          bankName: new FormControl(''),
          branchName: new FormControl(''),
          bankCountryCode: new FormControl(''),
          accountNo: new FormControl(''),
          ifscCode: new FormControl(''),
          micrCode: new FormControl(''),
          swiftCode: new FormControl('')
        })
      ])
    });

我有些想删除

_id

表单控件，因为控件很复杂我不知道如何删除。请帮忙。

Answer 1

这里的关键是浏览表单结构。一旦到达

_id

所在的表单组，您可以使用

removeControl('_id')

删除控件。

const arr: FormArray = this.GSTNForm.get('gstandbankDetails') as FormArray;
const grp: FormGroup = arr.get('0') as FormGroup;
grp.removeControl('_id');

我为每个导航创建了一个步骤，但如果您愿意，您可以将其包装成一个巨大的调用。

我的偏好是将嵌套表单组存储为属性，然后您可以调用：

this.nestedGroup.removeControl('_id');

演示：https://stackblitz.com/edit/angular-vmtzaw

Answer 2

您可以使用

removeControl

this.GSTNForm.get('gstandbankDetails').controls[0].removeControl('_id')

Answer 3

这将清除您的整个表单数组。

this.form.get('images')['controls'].splice(0,this.form.get('images')['controls'].length);