Angular 7 で html に Nz Zorro Ant を使用してアップロード ファイルから fileList を取得しました。データは Spring Boot API を使用してデータベースに投稿されます。[nzRemoved] を使用して fileList のファイルを削除したいと考えています。それの使い方?
これは私の .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)
}
}
そして、これは私の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>
[nzRemoved] を追加すると、UI のファイル ボタンの削除が機能しません。