How to delete file in fileList using nzRemoved in Angular7 - spring-boot

Question

I have a fileList from upload file using Nz Zorro Ant for html in Angular 7, data will post to database using Spring Boot API, I want to use [nzRemoved] to delete file in fileList. How to use it?
This is my .ts,
checkUpload(event) {
// console.log(event);
// this.payload = JSON.stringify(event.file.response);
if (event.type === 'success'){
// (<Array<any>>this.fileList).pop();
this.fileList.push({
uid : event.file.uid,
name : event.file.name,
status: event.file.status,
url : event.file.response.data[0].path_url
});
// this.payload = JSON.stringify(this.fileList);
this.project.doc_url = JSON.stringify(this.fileList);
this.projectOverviewService.postDocument(this.project_id,
this.fileList).subscribe( res => {
console.log('success');
});
}
}
handleRemove(){
for (let i = 0; i <= this.fileList.length; i++) {
this.fileList.splice(0 , i)
}
}
And this is my html,
<div nz-col nzSpan="6" >
<nz-upload
nzAction="/upload/documents"
[(nzFileList)]="fileList"
(nzChange)="checkUpload($event)"
[nzRemove]="handleRemove">
<button nz-button type="button"><i nz-icon nzType="upload"></i>
<span>Upload dokumen Overview</span></button>
</nz-upload>
</div>
When I add [nzRemoved], removing file button in UI can not work.

Answer 1

You can change your code like this::
HTML
<div nz-col nzSpan="6" >
<nz-upload
nzAction="/upload/documents"
[(nzFileList)]="fileList"
(nzChange)="checkUpload($event)"
[nzRemove]="handleRemove">
<button nz-button type="button"><i nz-icon nzType="upload"></i>
<span>Upload dokumen Overview</span></button>
</nz-upload>
</div>
JS
handleRemove= (file: any) => new Observable<boolean>((obs) => {
}