ng2-file-upload和读取文件内容

时间:2018-09-13 19:41:54

标签: angular

全部

我正在尝试读取使用ng2-file-upload拖放的文件的内容,但无法弄清楚。我希望能够在上传之前获取数据并将其放入网格中。

这是我的HTML代码

<div ng2FileDrop
    [ngClass]="{'file-over': hasFileOver}"
    (fileOver)="fileOver($event)"
    (onFileDrop)="fileDrop($event)"
    [uploader]="uploader"
    class="well my-drop-zone">
    Drop zone
</div>

这是我的.ts代码

public fileDrop(e: any):void {
  console.log("drop", e);
  this.hasFileOver = e;
}

public fileOver(e: any):void {
  console.log("over", e);
  console.log(this.uploader);
  this.hasFileOver = e;
}

我一直在尝试各种不同的操作,但无法弄清楚如何获取数据。

Thx jonpfl

1 个答案:

答案 0 :(得分:0)

您可以参考以下stackoverflow答案:https://stackoverflow.com/a/39644736/4337932

这是它的意思:

uploader: FileUploader = new FileUploader({}); //Empty options to avoid having a target URL
reader: FileReader = new FileReader();

ngOnInit() {
    this.reader.onload = (ev: any) => {
        console.log(ev.target.result);
    };
    this.uploader.onAfterAddingFile = (fileItem: any) => {
        this.reader.readAsText(fileItem._file);
    };
}