Node.js 在angular node multer中上载多个文件

我在以angular、node、multer方式上载多个文件时遇到问题。 阵列中的最后一个文件已上载到服务器

这是我的HTML

<div class="mb-1">
    <p class="text-muted m-0">Anti Black List</p>
    <input type="file"  (change)="fileChangeEvent($event)" name="Anti Black List" id="4" #fileDataAntiBlackList (onFileSelected)="onFileSelected($event ,fileDataAntiBlackList)" ng2FileSelect [uploader]="uploader"  accept="application/pdf"/>  
  </div>
<div class="mb-1">
    <p class="text-muted m-0">Anti Black List</p>
    <input type="file"  (change)="fileChangeEvent($event)" name="Shop Act" id="3" #fileDataShopAct (onFileSelected)="onFileSelected($event ,fileDataShopAct)" ng2FileSelect [uploader]="uploader"  accept="application/pdf"/>  
  </div>
<div class="mb-1">
    <p class="text-muted m-0">Anti Black List</p>
    <input type="file"  (change)="fileChangeEvent($event)" name="Professional Tax" id="2"  #fileDataPRO (onFileSelected)="onFileSelected($event ,fileDataPRO)" ng2FileSelect [uploader]="uploader"  accept="application/pdf"/>  
  </div>
<div class="mb-1">
    <p class="text-muted m-0">Anti Black List</p>
    <input type="file"  (change)="fileChangeEvent($event)" name="GST Copy" id="1" #fileDataGST (onFileSelected)="onFileSelected($event ,fileDataGST)" ng2FileSelect [uploader]="uploader"  accept="application/pdf"/>  
  </div>
<mat-label>First name</mat-label>
    <input formControlName="f_name" matInput type="text" name="first_name" placeholder="First name"  required/>
<mat-label>Last name</mat-label>
    <input formControlName="l_name" matInput type="text" name="Last_name" placeholder="Last name" required/>
<button mat-raised-button color="primary" class="mx-4" (click)="onSubmit()"
        [disabled]="uploader.getNotUploadedItems().length && signupForm.invalid">Upload And Save </button>

API函数

router.post('/newUpload',function(req,res){
console.log('before upload',req.body);
upload(req,res,function(err) {
    //console.log(req.body);
    //console.log(req.files);
    if(err) {
        return res.end("Error uploading file.");
    }
    console.log('files', req.files);
    console.log(req.body);
    res.send(req.files);
    //res.end("File is uploaded");
});
});

这就是我尝试过的。阵列中只有最后一个文件保存在uploads文件夹中。 我还想在数据库中插入名字、姓氏等，但当控制台req.body为空json{}

编辑问题 我找到了我想去的地方。 这是角度代码：当我打印时

const files: Array<File> = this.filesToUpload;

所以在onsubmit函数中

onSubmit() {
let files = this.getFiles();
let formData = new FormData();
for(let i = 0; i < files.length;i++){
  console.log(files[i]);
  formData.append("files", files[i],files[i]['name']);
}

---

注意：当我在formdata.append中发送文件名时，我会在node serevr中获取所有文件名。

您忘记将multer中间件添加到路由器中了。post 应该是

outer.post('/newUpload',
    upload.array('myFiles', 12),
    function(req,res){
    upload(req,res,function(err) {

   if(err) {
        return res.end("Error uploading file.");
    }
    res.send(req.files);
    //res.end("File is uploaded");
});
});

---

在尝试了不同的解决方案后，我最终得到了工作解决方案，通过该解决方案，多个文件和其他输入字段也被发送到服务器

在我的问题的编辑部分，我使用了以下功能

getFiles(){
return this.uploader.queue.map((fileItem) => {
      return fileItem.file;
   });
}

getFiles(){
return this.uploader.queue.map((fileItem) => {
  return fileItem.file;
});
}

上面的代码给出了一个错误。我刚换了回路线

来自

return fileItem.file;

至

return fileItem.file.rawFile;

---

就这样。所有剩余代码与编辑中的代码相同。

您可以在我的代码中看到

let upload=multer（{storage:user_storage}）.array（'files'，10）我使用了数组。顺便说一句，我已经尝试了你的代码，但我仍然面临同样的问题。它将上载数组中的最后一个文件。当您在表单数据中追加数据时，请尝试执行``formData.append（“files[]”，files[i]，files[i]['name']）；`````而不是``formData.append（“files”、files[i]、files[i]['name']）```当我使用
FormData.append（“files[]”，files[i]，files[i]['name']）时，您可以在这里阅读有关FormData用法的更多信息我得到错误MULTERROR：意外字段发生此错误是因为multer中的字段名和名称不同
getFiles(){
return this.uploader.queue.map((fileItem) => {
  return fileItem.file;
});
}

return fileItem.file;

return fileItem.file.rawFile;