是否可以通过文件上传上传JSON文件并在不与API通信的情况下读取Angular 6中的内容？

Question

将下载的JSON文件作为结构.希望能够通过Angular中的文件上传(使用Angular 6)上传它,然后直接在Angular中读取文件的内容,而不是将其上传到API.

搜索类似的接缝以恢复如何在Angular中读取服务器上的本地文件,而不是通过文件上载.

Answer 1

您可以尝试以下方法:

//In your Template:
<input type="file" name="files" (change)="uploadFile($event)" />

//In your component:
uploadFile(event) {
  if (event.target.files.length !== 1) {
    console.error('No file selected');
  } else {
    const reader = new FileReader();
    reader.onloadend = (e) => {
      // handle data processing
      console.log(reader.result.toString());
    };
    reader.readAsText(event.target.files[0]);
  }
}

我创建了这个演示.看看并检查这是否是您所需要的.