Question

试图读取简单的文本文件，但似乎无法读取。当我选择图像时，它可以工作，但是当我选择文本文件或Word文档时，它告诉我：sanitizing unsafe URL value

这是我正在使用的代码：

onFilePicked(event: Event) {
    const filePicked = (event.target as HTMLInputElement).files[0];
    this.form.patchValue({ file: filePicked });
    this.form.get('file').updateValueAndValidity();
    const reader = new FileReader();
    reader.onload = () => {
      this.filePreview = reader.result;
    };
    reader.readAsDataURL(filePicked);
  }

这是HTML代码

<div>
     <button class="btn btn-outline-info btn-sm" type="button" 
     (click)="filePicker.click()">Pick File</button>
     <input type="file" #filePicker (change)="onFilePicked($event)">
     </div>

     <div class="file-preview" *ngIf="filePreview !== '' && filePreview && 
     form.get('file').valid">
      <img [src]="filePreview" [alt]="form.value.title">
</div>

有没有人发现错误，我一直在阅读其他文章，但他们使用jQuery。欢迎解决这个错误的任何想法，谢谢！

Answer 1

用于Word文档或文本，而不要使用reader.readAsUrl(filePicked); 更改为reader.readAsText(filePicked);。同样，在显示信息时，一个小错误是使用<img>标签而不是普通的div标签。

在（Angular）TypeScript中使用FileReader读取文本文件

1 个答案: