javascript - 如何在应用程序中使用ng-file-upload(angularjs的新功能)？

我在尝试同时选择文件的同时尝试上载文件。我正在使用angularjs应用程序，在该应用程序中，我需要浏览文件并同时将其上载到表行中。

<form>
         <input type="text" class="browse-form"placeholder="   Click browse to load documents " required>
         <button ngf-select="vm.uploadFiles($files)" mutiple accept=".csv,.pdf" class="browse-btn">Browse</button>
        </form>
        <p style="margin-top: -30px;"> Note:Supported file formats are word,excel and pdf only</p>
        <table class="table">
         <tr>
         <thead style="background:#fff;font-size: 13px;font-weight:bold;">
         <th>DOCUMENT NAME</th>
         <th>SIZE</th>
         <th>VERSION</th>
         <th>DATE UPLOADED</th>
         <th>UPLOADED BY</th>
         <th>ACTION</th>
         </thead></tr>
         <tr><td ng-repeat="uploading in files" style="font:smaller">{{uploading.name}}
         <span class="progress" ng-show="uploading.progress >=0">
         <div style="width:{{uploading.progress}}" ng-bind="uploading.progress + '%'">
         </div>
         </span>
          </td>
         </table>

我的控制器

(function () {
'use strict';

angular
.module('app',['ngFileUpload'])
.controller('ManageController', ManageController);

 ManageController.$inject=['$http','$scope','localStorageService','workspaceService','Upload','$timeout'];

 function ManageController($http,$scope,localStorageService,workspaceService,Upload,$timeout) {
    var vm = this;
    //uploading
    vm.uploadFiles=function(files){
    vm.files=files;
 angular.forEach(files,function(file){
  file.upload=Upload.upload({
      url:' ',
      data:{file:file}
  });
  file.upload.then(function(response){
      $timeout(function(){
          file.result=response.data;
      });
  });

  });
  }
  }
  })();

我已经将ng-file-upload-shim.min.js和ng-file-upload.js的脚本都包含在我的主要index.html中，作为脚本.....
仍然无法在我的应用程序中获得完整的空白屏幕，说明ngFileUpload拼写错误。

最佳答案

在html中，只需添加以下代码即可。

<button class="btn btn-danger active" ngf-select="upload($file)">Upload</button>

在控制器中，您可以这样做。

$scope.upload = function (file) {
  if(file){
   try{
    var token = 'token if required' ; // optional field
    Upload.upload({
        url: 'enter url to hit api',
        data: {file: file, 'username': $scope.username},
        headers: {'Authorization': 'JWT ' + token},
    }).then(function onSuccess(response) {
        console.log("success");
    }).catch(function onError(response) {
        console.log("error",response);
    });
  }catch(error){
    console.log(error.message);
  }
}

};

去尝试一下。
它为我工作.. :)

关于javascript - 如何在应用程序中使用ng-file-upload(angularjs的新功能)？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43244619/