javascript - How can i work with ng-file-upload in a application(new to angularjs)? -

i trying upload file while select simultaneously,i'm working angularjs application need browse file along uploading @ same time table rows.

<form>          <input type="text" class="browse-form"placeholder="   click browse 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 word,excel , 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> 

my controller

(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;       });   });    });   }   }   })(); 

i have included both scripts of ng-file-upload-shim.min.js , ng-file-upload.js in main index.html script..... still im getting complete blank screen in application stating ngfileupload spelled wrong.

in html add following code..

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

and in controller u can this..

$scope.upload = function (file) {   if(file){    try{             var token = 'token if required' ; // optional field     upload.upload({         url: 'enter url 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);   } } 

};

just try it. worked me.. :)