TypeScript. FormGroup FormArray - chỉ xóa một đối tượng phần tử theo giá trị. Góc 2 4

Question

this.formGroup = this.formBuilder.group({ 
    images: this.fb.array([]) 
}); 

tôi thêm yếu tố mới theo cách này: this.images.push(new FormControl(new ImageCreateForm(this.imageResponse.id)));

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

lớp của tôi:

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

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

Khi tôi thêm hình ảnh, sau đó {{ formGroup.value | json }} của tôi là:

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

Tôi muốn xóa hình ảnh (ví dụ: chỉ hình ảnh với id=502) từ formGroup trước khi tôi gửi yêu cầu POST biểu mẫu của mình. Có thể không? Tôi đã thử sử dụng phương pháp reset, nhưng điều này sẽ xóa tất cả các thành phần: this.images.reset({"id":image.id});. Trong đó image là đối tượng ImageResponse.

Kết quả: {"images": [ null, null, null ]}, nhưng tôi muốn:

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

Answer 1

FormArray lớp có removeAt mà mất chỉ số. Nếu bạn không biết chỉ mục, bạn có thể thực hiện giải pháp thay thế:

this.images.removeAt(this.images.value.findIndex(image => image.id === 502))