如何在 angular 中適當更改 ng2-file-uploader 的文件名

Question

我想通過 ng2-file-uploader 更改 angular 中的圖像名稱，然后將其傳遞給我的 node.js 中的 multer。

一切正常。 我能夠接收到圖像，並且它存儲在服務器端的上傳目錄中。 只是我不知道在哪里更改圖像名稱。 我在 onCompleteItem 方法中嘗試過，但沒有。 這是一些代碼：

import {  FileUploader, FileSelectDirective } from 'ng2-file-upload/ng2-file-upload';

@Component({
  selector: 'name',
  templateUrl: './some.html',
  styleUrls: [./some.css]
})
export class ComponentName {
  public uploader: FileUploader = new FileUploader({ url: "myurl", itemAlias: 'myPhoto' });

  ngOnInit(){
    this.uploader.onAfterAddingFile = (file) => {};
    this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {
      //create my name
      item.file.name = "my name"
      alert('File uploaded');
    }; 
    this.uploader.uploadAll();
  }
}

我只想更改名稱，以便可以將它與我擁有的其他輸入值一起存儲在我的數據庫中。

Answer 1

您可以使用onAfterAddingAll作為解決方法：

 this.uploader.onAfterAddingAll = (files: FileItem[]) => {
        files.forEach(fileItem => {
            fileItem.file.name = fileItem.file.name.replace(/\.[^/.]+$/, "");
            (<any>fileItem).previewUrl = this.sanitizer.bypassSecurityTrustUrl((window.URL.createObjectURL(fileItem._file)));
        });
    };

Answer 2

這其實很簡單。 你幾乎明白了，但你選擇了錯誤的方法。 您可以在onAfterAddingFile方法中更改文件名。 下面我可以給你看一些代碼

import {  FileUploader, FileSelectDirective } from 'ng2-file-upload/ng2-file-upload';

@Component({
  selector: 'name',
  templateUrl: './some.html',
  styleUrls: [./some.css]
})
export class ComponentName {
  public uploader: FileUploader = new FileUploader({ url: "myurl", itemAlias: 'myPhoto' });

  //new name string variable
  newFileName : string;

  ngOnInit(){
    this.uploader.onAfterAddingFile = (file) => {
      //create my name
      file.file.name = "new name";
      //save in variable
      newFileName = file.file.name;
    };
    this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {
      alert('File uploaded');
    }; 
    this.uploader.uploadAll();
  }
}

這樣，您可以傳遞一個完整的新文件名，或者您可以使用 javascript 的字符串替換方法和正則表達式來替換文件名中的字符。 希望這有幫助。