0

Hi I am trying to upload multiple files in angularjs. I am not able to upload multiple files as it is giving me error eferenceError: $upload is not defined This is my html code.

<div class="upload-button" ng-repeat="file in files">
                <div class="upload-button-icon">
                    <img src="images/folder-small.png">
                    <div class="upload-text">{{file}}</div>
                    <input type="file" id="file1" name="file1"  />
                </div>
            </div>
  <input type="submit" value="{{ 'NEXT' | translate }}" class="blue-button" ng-click="upload()">

Below is my angularjs code to upload file.

  $scope.upload = function () {
                debugger;
                var fileuploadurl = baseurl + 'api/Customer/UploadLeaseFiles/' + LoginID + '/' + "GOSI";
                for (var i = 0; i < $scope.files.length; i++) {
                    var $file = $scope.files[i];
                            $upload.upload({
                                url: fileuploadurl,
                                file: $file,
                                progress: function (e) {
                                    // wait...
                                }
                            })
                              .then(function (data, status, headers, config) {
                                  alert('file is uploaded successfully');
                              });
                        }
                        alert('file is uploaded successfully');
            };

Above code gives me error $upload is not defined. May i know where i am doing wrong in the above code? Any help would be appreciated. Thank you.

Niranjan Godbole
  • 2,135
  • 7
  • 43
  • 90
  • what is `$upload` & where have you injected it if its a service? – Agam Banga Jun 06 '17 at 06:11
  • Thank you. I am not sure as i am new to Angularjs. May i know what is the correct code i should i write there to upload file? – Niranjan Godbole Jun 06 '17 at 06:13
  • how did you find the `$upload` . is this a service? – Agam Banga Jun 06 '17 at 06:14
  • May i know $upload is a built in service? do i need to invoke it like $scope,$$translate,$window etc? – Niranjan Godbole Jun 06 '17 at 06:17
  • Nops `$upload` is not an inbuilt service. where did you find the code to use this? – Agam Banga Jun 06 '17 at 06:19
  • i found at http://www.c-sharpcorner.com/UploadFile/cd7c2e/create-multi-file-uploader-using-angularjs/ – Niranjan Godbole Jun 06 '17 at 06:20
  • see this line `angular.module('mod', ['angularFileUpload']);`; he has injected `angularFileUpload` module in the app & then injected the `$upload` service by this line `var x = ['$scope', '$upload', function ($scope, $upload) {` – Agam Banga Jun 06 '17 at 06:21
  • Check this answer https://stackoverflow.com/a/31644349/6608165 – Rajath M S Jun 06 '17 at 06:23
  • Thanks that link does not contains information about how to upload to api? Actually i tried that but did not know how to write upload code and i camr back to http://www.c-sharpcorner.com/UploadFile/cd7c2e/create-multi-file-uploader-using-angularjs/ – Niranjan Godbole Jun 06 '17 at 06:25
  • Again coming to this scenario, at a time user can upload one file not multiple, but totally user can upload files based on the array ng-repeat="file in files". May i get some example similar to like this? – Niranjan Godbole Jun 06 '17 at 06:56
  • Try this..this might help you to upload multiple files [Plunker](https://stackoverflow.com/questions/31404502/upload-multiple-files-in-angular) – Nainish Modi Jun 06 '17 at 08:41

0 Answers0