如何从以下表单中提出确切的ajax请求？

Question

我有以下表格：

<form action = "/upload-file" method="post" enctype="multipart/form-data">
      <div class="form-group" style="display: inline; float:left;">
        <input type="file" (change)="submit($event)" name = "pic" style="margin-top: 10%;">
      </div>
</form>

在服务器端，我正在使用multer来捕获文件并存储它。虽然如果我尝试在提交函数中提交此表单（upload.single('pic');），使用event.srcElement.form.submit()可以正常工作，但我似乎无法通过ajax调用获得完全相同的结果。

我试过了：

jQuery.ajax({
        url: '/upload-file',
        type: 'POST',
        cache: false,
        dataType: 'file',
        contentType: false,
        processData: false,
        data: files,
        success: function (datat) {
            console.log('success');
            return false;
        }

但是mutler似乎并不接受它。如何设置文件的字段名等？或者我如何让jQuery提交与表单完全相同但没有刷新/重定向页面的东西？

这是文件从成功的表单提交中看起来的样子：

编辑：

上传需要有'pic'字段名，否则upload.single('pic')将不接受。这就是我认为我需要弄清楚如何设置。