0

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 のファイル ボタンの削除が機能しません。

4

1 に答える 1