Question

我正在尝试上传两个不同的文件，一个图像和一个pdf文件，每个文件来自不同的输入，如下所示：

<div class="form-group" ng-class="libraries.error.img[0] ? 'has-error' : ''">
     <label for="img">Image</label>
     <input type="file" accept="image/*" ngf-select="" ngf-multiple="true"  class="form-control" id="img" name="img" placeholder="Image" ng-model="libraries.library.img">
     <p ng-if="libraries.error.img[0]" style="color: red">{{libraries.error.img[0]}}</p>
</div>

<div class="form-group" ng-class="libraries.error.document[0] ? 'has-error' : ''">
     <label for="document">Document</label>
     <input type="file" accept="application/pdf" ngf-select="" class="form-control" id="document" name="document" placeholder="Document" ng-model="libraries.library.document">
     <p ng-if="libraries.error.document[0]" style="color: red">{{libraries.error.document[0]}}</p>
</div>

在服务文件中，我使用以下内容发送它：

store: function (library) {
       console.log(library);
       return  Upload.upload({
       url: 'api/libraries',
       method: 'POST',
       fields: {name: library.name, location: library.location},
       file: [library.img, library.document]
         });
       },

但是当我尝试在服务器端获取文件时如下：

return $_FILES;

我一直在：

[] No Properties

但是当我将文件更改为

时

file: library.img

意思是，我只传递一个文件，它有效。

我将ng-file-upload与AngularJS一起使用，服务器端为Laravel

有任何想法可以解决这个问题，允许将两个文件发送到服务器吗？！

Answer 1

我有同样的问题，我能够通过为每个文件提供一个不同名称的JSON对象来解决它（从here中汲取灵感）。如果我没有重命名对象，服务器将收到正确数量的文件，但所有文件都是相同的。因此，如果您要应用此代码，您的代码将是：

store: function (library) {
   console.log(library);
   return  Upload.upload({
   url: 'api/libraries',
   method: 'POST',
   fields: {name: library.name, location: library.location},
   file: [library.img, library.document]
   fileFormDataName: [name1, name2]
     });
   },

我相信名字可以是任何东西，只要它们是独一无二的。但是，您现在必须在服务器端单独处理对象。我不熟悉你在PHP中如何做到这一点，但在我的Rails后端，我可以按类收集所有文件：

files = params.values.find_all { |value| value.class == ActionDispatch::Http::UploadedFile }

然后我只是将每个文件分配给我的模型的相应属性。

AngularJs：从不同来源上传多个文件

1 个答案: