Чтение содержимого файла с помощью angular-file-upload

Я использую модуль angular-file-upload для загрузки файлов в проект angularjs. Я хочу прочитать содержимое файла с помощью FileUploader и отобразить его в текстовом поле.

Пожалуйста, предложите, как я могу достичь этого

заранее спасибо

Контроллер

'use strict';


angular.module('app', ['angularFileUpload'])


.controller('AppController', ['$scope', 'FileUploader', function($scope, FileUploader) {
    var uploader = $scope.uploader = new FileUploader({
        url: 'rest/fileupload'
    });
    $scope.filecontent;
    // CALLBACKS

    uploader.onWhenAddingFileFailed = function(item /*{File|FileLikeObject}*/, filter, options) {
        console.info('onWhenAddingFileFailed', item, filter, options);
    };
    uploader.onAfterAddingFile = function(fileItem) {
        console.info('onAfterAddingFile', fileItem);
    };
    uploader.onAfterAddingAll = function(addedFileItems) {
        console.info('onAfterAddingAll', addedFileItems);
    };
    uploader.onBeforeUploadItem = function(item) {
        console.info('onBeforeUploadItem', item);
    };
    uploader.onProgressItem = function(fileItem, progress) {
        console.info('onProgressItem', fileItem, progress);
    };
    uploader.onProgressAll = function(progress) {
        console.info('onProgressAll', progress);
    };
    uploader.onSuccessItem = function(fileItem, response, status, headers) {
        console.info('onSuccessItem', fileItem, response, status, headers);
    };
    uploader.onErrorItem = function(fileItem, response, status, headers) {
        console.info('onErrorItem', fileItem, response, status, headers);
    };
    uploader.onCancelItem = function(fileItem, response, status, headers) {
        console.info('onCancelItem', fileItem, response, status, headers);
    };
    uploader.onCompleteItem = function(fileItem, response, status, headers) {
        console.info('onCompleteItem', fileItem, response, status, headers);
    };
    uploader.onCompleteAll = function() {
        console.info('onCompleteAll');
    };

    console.info('uploader', uploader);
}]);

HTML

<body ng-controller="AppController" nv-file-drop="" uploader="uploader">
   <div class="well my-drop-zone" nv-file-over="" uploader="uploader">Base drop zone</div>
</body>

я хочу взять содержимое файла в переменную $scope.filecontent


angularjs angular-file-upload
person Durgesh Kumar    schedule 02.04.2017    source источник
comment
что ты уже испробовал? Пожалуйста, добавьте коды.   -  person lin    schedule 02.04.2017
comment
developer.mozilla.org/en/docs/Web/API/FileReader   -  person Alon Eitan    schedule 02.04.2017
comment
@lin я добавил код   -  person Durgesh Kumar    schedule 02.04.2017

Ответы (1)


arrow_upward
0
arrow_downward

По какой-то причине обратные вызовы не работали правильно, поэтому вместо этого после нажатия кнопки «Загрузить» в моем контроллере запустилась функция, которая зарегистрировала содержимое файла, а затем запустила функцию item.upload(). Я прикрепил базовый пример ниже.

someFxn(item) {
  console.log(item);
        
  item.upload();
}
<md-button class="md-blue" ng-click="$ctrl.someFxn(item)" ng-disabled="item.isReady || item.isUploading || item.isSuccess">
Upload
</md-button>

person PandaScript    schedule 19.05.2017