Question

我在Angular中有这段代码

import { Component } from '@angular/core';
import {NgForm} from "@angular/forms";

@Component({
  selector: 'app-add-route',
  templateUrl: './add-route.component.html',
  styleUrls: ['./add-route.component.scss']
})
export class AddRouteComponent {
  public fileContent: string;

    constructor() { }

    onSubmit(form: NgForm) {
    }

    getFile(event) {
      let file = event.target.files[0];
      let filename = file.name;
      let result;

      if((filename.split('.').pop()) === 'gpx') {
        let reader = new FileReader();
        reader.readAsText(file);
        this.fileContent = // what should be here?
      }
   }  

}

我想从表单中输入文件（必须是.gpx的类型）访问该文件，获取内容（使用FileReader（））。如何将filecontent加载到类变量fileContent ？

中

Answer 1

要在Typescript中获取readAsText函数的结果，您需要为onload触发的FileReader事件设置箭头函数。

getFile(event) {
  const file = event.target.files[0];
  const filename = file.name;

  if ((filename.split('.').pop()) === 'gpx') {
    const reader = new FileReader();
    reader.readAsText(file);
    reader.onload = (e: any) => {
        this.fileContent = e.target.result;
        console.log(this.fileContent);
    };
  }
}

然后，在箭头功能的主体内，您可以通过e.target.result（e作为事件）访问文件内容。从那里，你可以做你喜欢的数据。

FileRead（）将内容存储到类变量中

1 个答案: