TypeScript. FormGroup FormArray -按值只移除一个元素对象,Angular 2 4

gt0wga4j  于 2023-04-22  发布在  TypeScript
关注(0)|答案(3)|浏览(141)
this.formGroup = this.formBuilder.group({
    images: this.fb.array([])
});

我以这种方式添加新元素:this.images.push(new FormControl(new ImageCreateForm(this.imageResponse.id)));

get images(): FormArray {
    return <FormArray>this.formGroup.controls.images;
}

我的课程:

export class ImageCreateForm {
    id: number;
    constructor(id: number) {
        this.id = id;
    }
}

export class ImageResponse {
    id: number;
    url: string;
}

当我添加图像时,我的{{ formGroup.value | json }}是:

"images": [
   {
    "id": 501
   },
   {
    "id": 502
   },
   {
    "id": 503
   }
]

我想删除图像(例如只有图像与id=502)从formGroup之前,当我发送我的表单POST请求。这是可能的吗?我尝试使用reset方法,但这删除所有元素:this.images.reset({"id":image.id});。其中imageImageResponse对象。
结果:{"images": [ null, null, null ]},但我想要:

"images": [
   {
    "id": 501
   },
   {
    "id": 503
   }
]
l5tcr1uw

l5tcr1uw1#

FormArray类有removeAt,它接受索引。如果你不知道索引,你可以做一个变通:

// findIndex returns -1 if not found
// `removeAt` wraps around from the back if given negative
const index = this.images.value.findIndex(image => image.id === 502)
if(index !== -1) this.images.removeAt(index)
ee7vknir

ee7vknir2#

在Angular Reactive Forms中,formArray有一个名为removeAt()的方法。你可以通过传递一个你想要删除的索引来使用它:

delete(index){
    this.array.removeAt(index)
}
``
lbsnaicq

lbsnaicq3#

如果你想从FormGroup中删除一个特定Key的值,你可以使用下面的代码-

this.formGroupF.controls[value].patchValue(null)

相关问题