如何在 php 服务器端使用带有 angular 的流 js 获取多个文件上传图像

Question

在这里我添加了我的代码并将 codeigniter url 设置为 'apis/service/manish_sharma'，但是我的 api.so 中没有任何文件数组，请帮助我

<div 
  flow-init="{target:'apis/service/manish_sharma'}"                   
  flow-files-submitted="$flow.upload()"
  flow-file-added="!!{png:1,gif:1,jpg:1,jpeg:1}[$file.getExtension()]"
>
  <div class="drop" flow-drop ng-class="dropClass">
    <span class="btn btn-default" flow-btn>Upload Image</span>  
  </div>

  <br/>

  <div>
    <div ng-repeat="file in $flow.files" class="gallery-box">
      <span class="title">{{file.name}}</span>
      <div class="thumbnail" ng-show="$flow.files.length">
        <img flow-img="file" />
      </div>
      <div class="progress progress-striped" ng-class="{active: file.isUploading()}">
        <div class="progress-bar" role="progressbar"
        aria-valuenow="{{file.progress() * 100}}"
        aria-valuemin="0"
        aria-valuemax="100"
        ng-style="{width: (file.progress() * 100) + '%'}">
        <span class="sr-only">{{file.progress()}}% Complete</span>
      </div>
    </div>
    <div class="btn-group">
      <a class="btn btn-xs btn-danger" ng-click="file.cancel()">
        Remove
      </a>
    </div>
  </div>
  <div class="clear"></div>

  </div>
</div>

Answer 1

嗨，frd，我终于找到了解决方案

第 1 步： 在模板 html 文件中添加 html 代码

<div flow-init flow-name="uploader.flow"                        
                         flow-file-added="!!{png:1,gif:1,jpg:1,jpeg:1}[$file.getExtension()]">
                      <div class="drop" flow-drop ng-class="dropClass">
                           <!--<span class="btn btn-default" flow-btn>Upload Image</span>-->  
                           <input type="file" flow-btn />
                      </div>

                      <br/>

                      <div>

                        <div ng-repeat="file in $flow.files" class="gallery-box">
                          <span class="title">{{file.name}}</span>
                          <div class="thumbnail" ng-show="$flow.files.length">
                            <img flow-img="file" />
                          </div>
                          <div class="progress progress-striped" ng-class="{active: file.isUploading()}">
                            <div class="progress-bar" role="progressbar"
                                 aria-valuenow="{{file.progress() * 100}}"
                                 aria-valuemin="0"
                                 aria-valuemax="100"
                                 ng-style="{width: (file.progress() * 100) + '%'}">
                              <span class="sr-only">{{file.progress()}}% Complete</span>
                            </div>
                          </div>
                          <div class="btn-group">
                            <a class="btn btn-xs btn-danger" ng-click="file.cancel()">
                              Remove
                            </a>
                          </div>
                        </div>
                        <div class="clear"></div>
                      </div>

                    </div>

         <button class="btn-primary btn" type="button" ng-click="upload_fun()">Add Service</button>

第 2 步： 在 angular 控制器中声明变量

 $scope.uploader={};


 $scope.upload_fun = function()
 {
                    $scope.uploader.flow.opts.testChunks=false;
                    $scope.uploader.flow.opts.target='apis/service/manish_sharma; /* your server side api path*/
                    $scope.uploader.flow.upload();
 }

第 3 步： 无论您声明服务器端路径如何
Codeigniter（PHP 框架）
控制器名称：服务
函数名称：manish_sharma

function manish_sharma()
 {

       $target_file = '/upload' . basename($_FILES['file']['name']);

        move_uploaded_file($_FILES['file']['tmp_name'],$target_file);

        echo "<pre>";
        print_r($_FILES);

 }

如何在 php 服务器端使用带有 angular 的流 js 获取多个文件上传图像

How to get mutilple file upload images using flow js with angular in php server side

php

codeigniter

angularjs

flow-js