Node.js Angular NodeJ在添加文件时出错

Node.js Angular NodeJ在添加文件时出错,node.js,angular,typescript,mongodb,multer,Node.js,Angular,Typescript,Mongodb,Multer,您好,我正在尝试使用Angular和Nodejs将一个新文件添加到我的mongodb数据库中 后端功能在postman上运行良好 但在前端,它给了我一个错误,我没有找出问题所在 在我对后端函数做了一些更改之前,它一直在工作 这是我的POST API router.post('/create',multer({ storage : storage}).any(), (req, res) => { var sample = fs.readFileSync('./uploads/'+re

您好,我正在尝试使用Angular和Nodejs将一个新文件添加到我的mongodb数据库中 后端功能在postman上运行良好 但在前端,它给了我一个错误,我没有找出问题所在

在我对后端函数做了一些更改之前,它一直在工作

这是我的POST API

router.post('/create',multer({ storage : storage}).any(), (req, res) => {
    var sample = fs.readFileSync('./uploads/'+req.files[0].filename,'utf8');
    function Filetostring(){ 
        let arr = sample.split(/\r?\n/);
        // Find returns the first element that matches our criteria
        const step = arr.filter((step , idx)=> {
            if (step.includes("step")) {
             console.log(step);             //this gives me the first result I need
    
             return true;
    
            }
            return false;
         }); 
       let stepss = JSON.stringify(step)
       let newString = stepss.replace(/[\[\]\'\s]/g, ' ');
       let newString2 = newString.replace(/"/g, '');
       let newString3 = newString2.replace(/#step/g, '');
       let newString4 = newString3.replace(/,/g, '\n');

       return newString4;
     }
         
     let steps = Filetostring()
     console.log(steps)

    
    var tc = new Testcase({
        name: req.body.name,
        upload: req.files[0].filename ,
        
        run : steps,
        
        modify: req.body.modify,
        delete: req.body.delete,
        step1: req.body.step1,
        step2: req.body.step2,
        step3: req.body.step3,
        step4: req.body.step4,
        step5: req.body.step5,
        step6: req.body.step6,
        step7: req.body.step7,
    });
    
    console.log(req.files[0].filename);
    tc.save((err, doc) => {
        if (err) { res.status(401).send("errorrrrr") }
        else { 
            res.status(200).send(doc)
        }
    });
});

这是我的服务。ts

  private create = 'http://localhost:5555/testcase/create';

  postTestCase(testcase,file:File) {
    const formData  = new FormData();
    formData .append('file', file);
    formData .append('name', testcase.name);
    formData .append('step1', testcase.step1);
    formData .append('modify', testcase.modify);
    formData .append('run', testcase.run);
    formData .append('delete', testcase.delete);
    formData .append('step2', testcase.step2);
    formData .append('step3', testcase.step3);
    formData .append('step4', testcase.step4);
    formData .append('step5', testcase.step5);
    formData .append('step6', testcase.step6);
    formData .append('step7', testcase.step7);

    return this.http.post<any>(this.create,   formData );
  }

  addtestcaseData = {'name': '',
  'step1': '',
  
  'modify': '',
  'run': '',
  'delete': '',
  'upload': File = null,
  'step2': '',
  'step3': '',
  'step4': '',
  'step5': '',
  'step6': '',
  'step7':''}

  addtestcase(){
    this.testcaseService.postTestCase(this.addtestcaseData,this.addtestcaseData.upload)
    .subscribe(
      res => {
        console.log(res)
        this._router.navigate(['/admin'])
      },
      err => {
        console.log(err);
        
        
      }
    )     
  };

  handleFileInput(files: FileList) {
    this.addtestcaseData.upload = files.item(0);
  }


这是我的组件.html

<div class="card rounded-0">
          <div class="card-header">
            <h3 class="mb-0">Add Test Case</h3>
          </div>
          <div class="card-body">
            <form class="form" #testcaseForm="ngForm" enctype="multipart/form-data" >
              <div class="form-group">
                <label for="uname1">Name</label>
                <input [(ngModel)]="addtestcaseData.name" class="form-control rounded-0"  name="Name" type="text" required>
              </div>

              <div class="form-group">
                <label for="file" class="mr-2">Upload Test Case</label>
                <input type="file"
                       id="file"  name="file"
                       (change)="handleFileInput($event.target.files)">
                       <!--<button (click)="addfile()" type="button"  class="btn btn-success float-right">Add File</button>
                       -->
              </div>
              
              
              <button (click)="addtestcase()"  type="button"  class="btn btn-success float-right">Add</button>
            </form>
          </div>
          <!--/card-block-->
        </div>

添加测试用例
名称
上传测试用例
添加

尝试使用req.file获取文件

        var tc = new Testcase({
        name: req.body.name,
        upload: req.file,
        
        run : steps,
        
        modify: req.body.modify,
        delete: req.body.delete,
        step1: req.body.step1,
        step2: req.body.step2,
        step3: req.body.step3,
        step4: req.body.step4,
        step5: req.body.step5,
        step6: req.body.step6,
        step7: req.body.step7,
    });
    
    console.log(req.files[0].filename);
路线呢

router.post('/create',multer({ storage : storage}).single('upload'), (req, res) => {
对于前端,将输入的名称更改为

<input type="file"
                   id="file"  name="upload"
                   (change)="handleFileInput($event.target.files)">